1 / 17

Optimize Your Website Performance: Essential Strategies for Speed and Efficiency

Improve your website's performance by implementing key strategies that minimize HTTP requests, optimize resource loading, and enhance user experience. Start by reducing response time with techniques like image maps, CSS sprites, and combining scripts. Add expires headers for infrequently changing components and gzip resources to reduce load sizes. Furthermore, strategically position stylesheets at the top and scripts at the bottom to ensure progressive loading. Implement external files for JavaScript and CSS, minimize DNS lookups, and use minification for efficiency.

shaun
Télécharger la présentation

Optimize Your Website Performance: Essential Strategies for Speed and Efficiency

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Website Performance. • How websites works? • DNS LookUp.

  2. Rule 1:Make Fewer HTTP Requests • 10 -20% response time involves in retrieving the HTML page. • Remaining 80 -90% Response time spent in making HTTP requests for all components.(Images, scripts, stylesheets, Flash etc.)

  3. Some Techniques : • Image Maps • CSS Sprites • Combined scripts and stylesheets

  4. Rule 2 :Add an Expires Header • Use Far future expires header on components that changes infrequently. • Use expires header on Images, Scripts , Stylesheets.

  5. Rule 3: Gzip Components • How compression works ? • Request Header: • Accept – Encoding: gzip,deflate • Response Header: • Content – Encoding: gzip • What to Compress? • Scripts • Stylesheets • Static pages

  6. Stats :

  7. Rule 4: Put Stylesheets at the Top. • Progressive Rendering. • To reduce white blank screen effect.

  8. Rule 5: Put scripts at the bottom. • Parallel downloads: Browsers download two components in parallel per hostname.

  9. Parallel download using two hostname.

  10. Parallel downloading is disabled while script is downloading. • Scripts blocks downloads

  11. Worst case: Scripts at the Top

  12. Best case : Scripts at the bottom.

  13. Rule 6: Make JS and CSS External • Use inline scripts only in Home page • In all secondary pages, Use External files. • If every page on site uses same JS and CSS files, using external files will results in high reuse rate for these components. • Use Post-Onload download.

  14. Rule 7: Reduce DNS Lookups • Browser takes 20 -120 milliseconds to lookup the IP address of given hostname. • Avoiding DNS lookups cuts response time, but reducing parallel downloads may increase response times. • Guideline says to split components across at least two but no more than four hostnames.

  15. Rule 8: Minification/Obfuscation of JS • Minification: Remove unncessary characters , whitespaces,comments. • Obfuscation: It is like minification, but it also convert long function and variable names in smaller strings. • Minification should be used. • Tool for Minification : JSMin

  16. Some stats 85K: JS size without JSMin & gzip compression • 68K: JS size with only JSMin (21% savings) • 23K: JS size with only gzip compression (73% savings) • 19K: JS size with JSMin and gzip compression (78% savings)

  17. Some other Rules: • Avoid Redirects • Avoid Duplicate scripts. (Make sure scripts include only once.)

More Related