Geek Answers Handbook

IPhone / mobile safari = .css files block simultaneous server requests?

The mobile website project I was working on was recently reviewed by a performance consulting firm, and they returned recommending that we move all of our .css files to BOTTOM HTML to take into account issues on the iPhone where .css files might block simultaneous server requests.

I always knew this was true in most browsers when it comes to .js files - hence the common practice of placing .js links at the bottom of one HTML code, but I never heard of this .css.

I still need to get an answer from a consulting firm with quoted links, as this is a topical issue in Mobile Safari. Has anyone else heard of this and, if so, know any specific links that talk about it (maybe directly from Apple?)

+4
source share
2 answers

This is not intended to answer your question, but as a link:

Top recommendations for speeding up your website from Yahoo:

Put styles at the top

During a performance study at Yahoo !, we found that moving stylesheets in a HEAD document makes pages load faster. This is because setting stylesheets in HEAD allows the page to display progressively.

Their recommendation to move CSS to the bottom is unusual - it would be appreciated if you could share why they consider this a good idea.

to change . Looking at the general recommendations on apple.com, I did not find any specific link to CSS inclusion, applicable only to Mobile Safari. Basic, general instructions still claim that you should put CSS in a <head> . See this page .

+1
source

If you download the following URL ( http://waynepan.com/s/con/ ) on your desktop, and then in your mobile browser you will see curious behavior; In the browser on your desktop (at least in Chrome and Firefox) you will see that the boxes are filled from top to bottom right (in the same order as in the source code) and on the mobile device (at least iPhone, iPad). see the exact opposite.

Although this is undocumented, this observation suggests that the mobile browser first reads the main html file and then proceeds to render the page from bottom to top, thus first loading the latest hrefs and processing them to the top.

You will also notice that up to 6 mailboxes are loaded simultaneously in the desktop browser, and up to 4 are loaded in the mobile browser - this takes into account the maximum parallel connections allowed by the browser in question to any host.

Therefore, if page loading and rendering speed are especially important in your mobile web application, pay particular attention to the order in which the elements load. I think that your fellow consultants observed this behavior and wanted to force CSS to load to the rest of the content - all this will display with the right styles from the very beginning, which gives the illusion (or user experience) that the page loads faster,

Alas, my 1 cents is worth it - I hope this is food for thought. :-)

+1
source

More articles:


All Articles