Your SlideShare is downloading. ×
Gone in 4 seconds   web performance optimization
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Gone in 4 seconds web performance optimization

1,321
views

Published on

How to prevent your web users leave you in 4 seconds because your website is not loaded. This slide is provide overview how to optimize your website from backend to frontend.

How to prevent your web users leave you in 4 seconds because your website is not loaded. This slide is provide overview how to optimize your website from backend to frontend.

Published in: Technology

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,321
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
19
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. #TechnicalThursday Bandung Digital Valley Gone In 4 Seconds Web Performance Optimization Yohan Totting @tyohan
  • 2. Why?
  • 3. Response Time Server + Network 10-20% Load HTML Browser 80-90% Render HTML
  • 4. Backend Optimization
  • 5. Database Tuneup
  • 6. Choose Right Database and Engine
  • 7. Data Structure & Field Index
  • 8. Query All At Once vs Split to Multiple Query
  • 9. Optimize Your Configuration
  • 10. Application Tune Up
  • 11. App performance it’s not about the language It’s about your code
  • 12. Lazy Loading
  • 13. Cache is your nitro
  • 14. Be careful with looping
  • 15. Use Framework
  • 16. Web Server Tune Up
  • 17. Use Nginx
  • 18. Enable Compression
  • 19. Don’t forget necessary header
  • 20. ETags HTTP/1.1 200 OK Last-Modified: Tue, 12 Dec 2006 03:03:59 GMT ETag: "10c24bc-4ab-457e1c1f" Content-Length: 12195
  • 21. Expires Expires: Wed, 17 Jun 2015 20:00:00 GMT
  • 22. Use Caching Proxy
  • 23. Front End Tune Up
  • 24. Minimize Loading Time
  • 25. Reduce Dependencies Fewer files to download means fewer HTTP requests and faster loading times.
  • 26. Reduce Dependencies • Combine & minify CSS & javascript • Parallelize downloads across hostnames • Combine images using CSS sprites • Minimize DNS lookup • Avoid redirect
  • 27. Minimize Request Size • Keeping cookies and request headers as small as possible. • Serve static content from a cookieless domain
  • 28. Reduce Image Dimensions On top of the extra download time, precious processing power and memory are used to resize high-resolution images.
  • 29. Reduce Client-Side Processing Rethinking the use of JavaScript and keeping it to a minimum are best.
  • 30. RWD vs RESS
  • 31. Use Font Awesome Icon
  • 32. Mobile First
  • 33. Test It
  • 34. Thanks Yohan @tyohan