«« Vinogusto.com migration to a new Web Server
Wine Tasting 11th of October : the pictures… »»

We spent some time to improve the overall application performances (meaning the loading time of each web site page) in order, first, not to handicap the overall site by a resource consuming page, but also to offer to our visitors a fast navigation experience.

To summarize, the application is fast, the code is “clean” and what is sent to your browser is optimized for a very fast display.

The different web pages of Vinogusto.com are scored between 94 and 99 by the YSlow Yahoo tool. Again for the geeks, I provide below a summary of optimizations made the last days:

  • The tools used to observe and to improve performances are first the pear timer library (code execution stopwatch with indicators placed in the application - http://pear.php.net/package/Benchmark), and then, the firefox plugin YSlow from Yahoo (Quality evaluation of the application at browser level, through 13 criteria. Cf http://developer.yahoo.com/yslow/).
  • We’ve applied Minify (and concatenation to reduce the number of http requests) to all included files (JS + CSS), using the google minify code (http://code.google.com/p/minify/)
  • We’ve implemented a domain alias (http://asset1.vinogusto.com : a CDN – Content delivery network) to allow the browser to carry out more simultaneous requests and, in the future, foresee a dedicated server for the static content
  • We enabled compression of the text contents by the configuration of the gzip deflate module on apache (for the html, css & js content). It allows an important saving of the bandwidth (between 50% and 80% of saved size out pictures), and so, a faster delivery of the pages to your browser
  • I also configured the expiration headers and disabled the ‘etags’ in order to allow a better usage of the browser’s cache
  • All this is based on xhtml (transitional) code that validates (for most of the pages ; -) (http://validator.w3.org/check?uri=http%3A%2F%2Fwww.vinogusto.com%2F&charset=%28detect+automatically%29&doctype=Inline&ss=1&outline=1&group=0&No200=1&verbose=1)

Happy tasting !

3 Responses to “We optimised the code at server side & client-browser side”

  1. Luis Peralta Says:

    Hi,

    Just wondering why you disabled etag support as it is supposed to allow conditional fetching, as the expiration headers.

    Having tried the deflate module… doesn’t it remove the content-length headers of your requests? That’s what I encountered, suddenly losing keep-alive support as it requires that header to be present.

    Regards,

  2. jack Says:

    Hi Luis,

    We applied the 13 performance rules provided by Yahoo regarding the client-side code optimisation.

    A. Etag :

    If you look at the last § of the etag rule : “If you’re not taking advantage of the flexible validation model that ETags provide, it’s better to just remove the ETag altogether. The Last-Modified header validates based on the component’s timestamp. And removing the ETag reduces the size of the HTTP headers in both the response and subsequent requests.”… Etag are just not really needed (at least for vinogusto)…

    B. Deflate & content-length

    I observe that while gzip-deflate is active, the server provides the content-length header :
    Headers (provided by Firebug) :
    Content-Encoding gzip
    Content-Length 6557
    Keep-Alive timeout=15, max=100
    Connection Keep-Alive

    Are you using apache on Linux ? I can send you my htaccess config…

    Hope this helps a bit.

    Regards,

    jack

  3. Luis Peralta Says:

    Hi jack,

    Yes, apache on linux. The htaccess file would be really helpful. Thanks in advance!

Leave a Reply