The page I am working on has a javascript function executed to print parts of the page. For some reason, printing in Safari, causes the window to somehow update. I say somehow, because it does not really refresh as in reload the page, but rather it starts the "rendering" of the page from start, i.e. scroll to top, flash animations start from 0, and so forth. The effect is reproduced by this fiddle: http://jsfiddle.net/fYmnB/ Clicking the print button and finishing or cancelling a print in Safari causes the screen to "go white" for a sec, which in my real website manifests itself as something "like" a reload. While running print button with, let's say, Firefox, just opens and closes the print dialogue without affecting the fiddle page in any way. Is there something with my way of calling the browsers print method that causes this, or how can it be explained - and preferably, avoided? P.S.: On my real site the same occurs with Chrome. In the ex
There is really no hard, golden rule here. Typically, you want to make a page load with as few HTTP requests as possible. However the Ultimate goal is to make a page load as fast as possible. While reducing request count is key, it is not the only factor. For example, if you had a page with one 100k js file, no css, no images, no other requests. That page will load more quickly in most modern browsers if the page had 4 25k js requests because the 4 requests can be parallelized accross 4 connections. However, your typical web page has 30 to 100 requests and these will load much faster by combining files because most browsers are limited to 6 connections per host and there is latency involved in opening new connections as well as blocking issues with javascript and css depending on browser type where no other connections will be initiated until the js or css is loaded. This can also depend on if these resources are in the head or not.
ReplyDeleteSo it all depends on your page and your target browsers. Personally, I use 50k as a max size for a single css or js. This admittedly is not extremely scientific. Its a nice round number and one that I find accomodates several typical css or js files and is not so big that it is prohibitive.
Max size is maximum of largest request
ReplyDeleteeq
index 3KB
CSS 10KB
jquery 32Kb
Best size is about ~14KB = MTU + headers
eq
CSS 16Kb - 172ms
JS 32Kb - 359ms
Js 17KB - 281ms
JS 15,8KB - 250ms
ga.js 13KB - 109ms
Apache not compress deflate file greeter that 290KB
Conclusion
If you had 1 JS file about 32Kb
* Download this file: ~359ms
IF you had 2 JS file for 15Kb
* Download this 2 file: ~259ms