I have a script in the header that I'm putting on every page, for easy updating I stuck it in it's own page and added it using php include. I'm using media query break points to change the size of the layout in different screen sizes, and I don't want to include this script on small screens.
I don't think it's necessary to provide an example, it's just a php include file with a script tag, like the following:
<script>[script here]</script>
I think the solution would be to use PHP to include the file if min-width=40.063em, and for anything under that it wouldn't include it. I'm not very good with PHP, at all, so I've come here to see if anyone would know the best way to go about this and shoot me a small example. Thanks for all who help =)
PHP runs on the server. CSS runs on the client. You can't decide what content the server is going to send to the client based on information that only the client knows.
You can serve the content regardless and display: none it in your stylesheet when the media query matches.
Quentin is correct.
The only option might be to use Ajax or similar to load extra content from the server after the front end is rendered.
Related
This is a very broad question, so I'm just looking for the best way of doing this.
I want to periodically monitor certain pages on my website.
I am looking to write a PHP script which will load the page as if it is being loaded in a browser. So that means, it loads all CSS, Javascript, Images, Videos, etc...
I want to just get the load time of these pages and then email the results to myself in a crontab. For this I was going to use microtime() and a phpMailer.
Does anyone know of a script to load a complete page, or have any suggestions on how to go about this?
Thanks.
What if the page has dynamic content? You will also need to execute all the JavaScript and fetch all CSS images to get the final amount of time. I believe that is impossible using only PHP.
A php script you run from the same server you host your site will give you abnormal readings (very low) since it's loading on the first hop essentially. What you really would want to do is run a script from various servers outside of your own. There are also limitations with what php can see ie JS and JQuery etc.
The simplest is to check from your home pc, using jmeter. You set your home browser to use it as a proxy and go to whichever website you want. Jmeter will record statistics. When you are happy you can choose to save the stats.
This avoids the problems of handling JS and JQuery through a script.
This could get very complicated. You'd basically have to parse the HTML, and then there's tons of edge cases, like JS including resources, etc... I would definitely recommend using something like the network tab of Chrome's dev tools instead.
I have a js file that has the code for navigation for a site with ~600 pages..
Now I want to change the menu(colors, background, links etc) and I don't want to edit the JS file as the code here is like using images for the menu..so I was thinking that I will create a php file or html file and then call it inside that js file. Is this something possible?
Please advise.
You could have the js render an iframe instead of an img and pass along the url to the php/html.
You need to understand the difference between PHP, HTML and JS. They each occupy a different domain in web programming. PHP is for server side logic, HTML is a structural language and JS is an action-oriented language intended to function on top of the HTML that exists in the page (and may be rendered in JS).
All programmers have at one point tried to "hack" code like you are doing, by trying to find a band-aid fix to a complicated solution. It is not worth it. You will lose performance in the best of cases and either fail outright or lose browser compatibility and user interface quality the vast majority of the time.
In short, take your time and edit the JS. You can always do a find/replace on images to strip them out and insert CSS class declarations in their place. Do it right and you'll save yourself a big headache later on.
So, I'm in to cache everything on my website called http://apolloinvest.hu.
I sending gzipped, optimized images, js, css, and everything also the whole site is gzipped, the JS files are loads deferred, with LAB, and everything must be fantastic, I also made a browser cache. But my site is still loads for 1 sec to load any page, and not instantly do it.
Could you help me please, why?
My redbot andswer is: http://redbot.org/?uri=http%3A%2F%2Fapolloinvest.hu%2F
Google PageSpeed rank is 99/100 (Because I don't want to remove the comments from the jquery UI)
The answer for CSS files: http://redbot.org/?uri=http%3A%2F%2Fapolloinvest.hu%2Fda232d78aa810382f2dcdceae308ff8e.css
For JS files: http://redbot.org/?uri=http%3A%2F%2Fapolloinvest.hu%2F5ec01c6d8ca5258bf9dcef1fc6bfb38c.js
So to tell the true I dont know what is the matter, with my caching or my JSes. Thanks for the help guys.
Répás
The site is pretty fast as it is, but here are a few possible improvements:
Directly render the HTML page instead of using JavaScript to do so. Put all the <script> elements at the bottom of the HTML document (just before </body>) so that the browser can render the page even before the JavaScript code is downloaded.
You can concatenate all the JavaScript files into one. Currently, http://apolloinvest.hu/475a641fc1d70f7c92efa3488e27568f.js is just empty.
If possible, serve static content such as JavaScript files and styles with Cache-Control and Expires headers far in the future.
A couple of unrelated notes:
The site is not valid HTML. The additional overhead caused by the browser transforming it to valid HTML does not matter, but the readability (and compatibility) does.
Your stylesheet is restricted to screen. When printed out (or viewed on another non-screen device), it looks ugly.
The site breaks for users without JavaScript. It's just showing a loading bar, forever.
I sending gzipped, optimized images, js, css, and everything also the whole site is gzipped, the JS files are loads deferred, with LAB
THAT IS exactly your problem.
Instead of doing all that fancy stuff, you had to profile your application first, determine a certain bottleneck and then optimize the exact part that is causing the slowness.
Let me suggest you to start from the "Net" tab of Firebug where you can watch actual response times of the requests. It is very likely that your code runs FAST but some JS-based web-counter prevents the page from displaying immediately.
if it's 1 second that takes for the PHP code to execute - time to profile it. Xdebug or simple microtime(1)-based manual profiling can tell you where is the problem. Once you find it, you'll be able to ask more certain question here.
my head was spinning over this idea for a long time . and i though this is the right plce to ask for help ..
so what i want to do is make a really simple php file that make a search and replace in css files but the problem that i have is that a single css file can (as you all know ) have a 100 or more background tags and all i want to edit is one of them .. and what is some body added a line before or after ... so search and replace for the whole section of the css file that i want to replace well be useless unless it is all the same ..
i really have a bad time explanning but i hope that you get the main idea ..
all i want is some guidelines in this .. help is really appreciated/
I wouldn't suggest directly editing a linked CSS file through PHP (file_get_contents()) or something, but rather conditionally link different CSS files. Or perhaps, conditionally change what you need to change through CSS directly in HTML with PHP. For example, need to change background (for some reason) for different users, you would conditionally change the image source through PHP.
Why exactly do you want to do this? Maybe a CSS alternative like LESS is a viable option (it has support for variables etc)
You can either use php to load a stylesheet.php that is dynamically generated or use javascript to "compile" it on the client side (like LessCss)
i'm looking for a way to display a web page inside a div of other web page.
i can fetch the the webpage with CURL, but since it has an external stylesheet when i try to display it, it appears without all his style properties.
i remember facebook used this technique with shared links (you used to see the page that was linked with a facebook header)
did some unsuccessful jquery tests but I'm pretty much clueless about how to continue..
i know this can be done with frames but i always here that it's good practice to avoid frames so i'm a bit confused
any ideas how to work this out?
If you want to display the other website's contents exactly as they are rendered in that site then frames are, in this case, the best (easiest) way to go.
Facebook and Google both use this technique to display pages while maintaining their branding / navigation bar above the other site.
I am going to guess that Facebook still used an iFrame, just with no borders and a well placed header outside of it. The reason I am guessing that is because if the outside page has its own style sheet, there is a high probability that your styles and their styles will clash and not show things properly.
In order for the styles not to clash everything on both ends would have to be extremely detailed, not just generic styles applied to all paragraphs etc...
i agree that using frames would probably be the best solution for you problem.
but if you still want to avoid frames and put the contents into a div with the id externalConent, you could request the stylesheets the same way you get the other contents and prefix every rule in them with "#externalContent ". save these stylesheets to your server and include them in your page. with a few more customizations, that should work.
i have to admit this solution does sound quite strange... well, it is.
but it's the only way i see to do what you're asking for.
If you are unable to use a frame or iframe, try:
extract the HTML inside the BODY and inserting it into the destination DIV
extract the and sections at the header
Is not very clean though, but it will definitely work, you can insert a phpBB forum into another dynamic way using this technique, take a look at http://www.clearerimages.com/forum/ for an example.