Simple front end optimization of actual combat

The need for front-end optimization of

network project recently Joseph, front-end engineers we naturally think of several optimization front often mentioned the golden laws and precious rules in YSlow, we put part of experience sharing, superficial expression, when the right to communicate with

, laugh laugh!

to optimize the front end, naturally from two places, one is to reduce the number of requests for connections, and two is to compress the file size.

The use of

in the current project is carried out with the open source Minify, this is quite an affinity PHP small program, with a fairly elegant way with the vast majority of multiplex JS and CSS files, and can open text compression output function is very powerful tool, it is fairly easy to use configuration. If the five or six JS files used in the project merge, the request time can substantially reduce 15%~30%, which is impressive.

request is a very troublesome thing, the browser is maximum parallel download limit (of course you can manually increased, but the average user will not do), this time you need to use a separate picture name. Put a large number of pictures on another server, bind a two level domain name, and then quote, so that it can accommodate more parallel download, but also has some speed up effect.

interestingly, the widely used JQuery library project, version 1.4.4, basically meet the demand before the day, looks like the mini version of the size is about more than 70 KB, while the open GZIP compressed output, can be compressed to about 28KB, but for ordinary virtual host used in our program. High speed double IDC said is nonsense, in many places, a JQuery library also need to consume 250~450ms time. So I am here to use the Google JS provided by CDN library to speed up service, the reason is very simple, is to use an JS address Google to provide reference library using the Google large CDN network speed, Why not??

sample address:

(editor’s note: you can use Firefox’s Firebug plug-in to see the actual acceleration effect, and Google JS hosting is much better than our server,

only needs to load 150~250ms at normal speeds)

of course, here it is important to note that Google’s domain name in China, often blocked or analytical errors, in order to make our service more stable, there can be a JQuery object to determine if Google, JQuery files can be normal loading is nothing, if unable to load change with another here is the library, I use Microsoft’s JS.

Leave a Reply

Your email address will not be published. Required fields are marked *