0
Web optimization                 oàn Văn Tuy n                   Pentalog Vietnamhttp://www.facebook.com/doanvantuyen   do...
Gi i thi u chung• M c đích:  “Chia s m t s kinh nghi m giúp tăng t c    đ truy c p vào website”• Áp d ng:  “Dành cho nh ng...
Content1.   HTTP request flow diagram2.   Optimizing Page generate3.   Minimizing round-trip times4.   Minimizing request ...
1. HTTP request flow diagram                                                            DNS server                        ...
2. Optimizing Page generate•   Cache•   Opcode cache•   Server Configuration•   Optimize code & log analysis =>    Xdebug ...
2.1 Cache• What:  – Page cache  – Block cache  – Data cache• How:  –   Write on file  –   Memory  –   Database  –   Static...
2.2 Opcode cache•APC•PHP accelerator•eAccelerator•Alternative PHPCache•ionCube PHPAccelerator•XCache•Zend Accelerator     ...
2.3 Server Configuration• Apache  – MPM, remove .htaccess, GZip, ETag, Cache    control• PHP  – Maximum memory, maximum ex...
2.4 Optimize code & loganalysis• Demo XDebug• Other debug statement  –   pint_r($x) , print_r($x, true)  –   var_dump()  –...
3. Minimizing round-triptimes•   Use brower’s cache•   User external CSS & javascript•   Avoid 404 error•   Combine CSS & ...
3.1 Use brower’s cache            PHP DAY 18/12/2010   11
3.2 User external CSS &javascript             PHP DAY 18/12/2010   12
3.3 Avoid 404 error            PHP DAY 18/12/2010   13
4.4 Combine CSS & JS fileGOODBAD              PHP DAY 18/12/2010   14
4.5 Use CDN              PHP DAY 18/12/2010   15
3.6 Parallel download             PHP DAY 18/12/2010   16
4. Minimizing request /response size• Use a cookieless domain for static  content• Use GZip• Minify HTML, CSS, Javascript•...
4.1 Use a cookieless domain for staticcontent                    PHP DAY 18/12/2010   18
4.2 Use GZip               PHP DAY 18/12/2010   19
4.3 Minify HTML, CSS, JS             PHP DAY 18/12/2010   20
4.4 Optimize images• Do not use BMPs or TIFFs• Use PNG, GIF for small image or  simple graphics• Use JPG for photo• Reduce...
5. Optimizing brower   rendering•       Put CSS on top, javascript on        bottom•       Specify image size•       Post ...
6. Tools for Optimizing           XDebug & WinCacheGrind            PHP DAY 18/12/2010      23
6. Tools for Optimizing (Cont)                                https://addons.mozilla.org/en-US/firefox/addon/1843/http://c...
Reference•   http://code.google.com/speed/page-speed/docs/rules_intro.html•   http://developer.yahoo.com/performance/rules...
Thanks !           26
Upcoming SlideShare
Loading in...5
×

Web optimization

1,733

Published on

0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

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

No notes for slide

Transcript of "Web optimization"

  1. 1. Web optimization oàn Văn Tuy n Pentalog Vietnamhttp://www.facebook.com/doanvantuyen doanvantuyen@gmail.com 1
  2. 2. Gi i thi u chung• M c đích: “Chia s m t s kinh nghi m giúp tăng t c đ truy c p vào website”• Áp d ng: “Dành cho nh ng website có lư ng truy c p ít và trung bình v i tài nguyên h n ch ” PHP DAY 18/12/2010 2
  3. 3. Content1. HTTP request flow diagram2. Optimizing Page generate3. Minimizing round-trip times4. Minimizing request / response size5. Optimizing brower rendering6. Tools for Optimizing PHP DAY 18/12/2010 3
  4. 4. 1. HTTP request flow diagram DNS server t u es Req se S on N sp PHP compile & parser D re S DNRender page Page HTTP request Page HTTP response Image, JS, CSS request Client Image, JS, CSS DB Web server PHP DAY 18/12/2010 4
  5. 5. 2. Optimizing Page generate• Cache• Opcode cache• Server Configuration• Optimize code & log analysis => Xdebug PHP DAY 18/12/2010 5
  6. 6. 2.1 Cache• What: – Page cache – Block cache – Data cache• How: – Write on file – Memory – Database – Static/Global variable PHP DAY 18/12/2010 6
  7. 7. 2.2 Opcode cache•APC•PHP accelerator•eAccelerator•Alternative PHPCache•ionCube PHPAccelerator•XCache•Zend Accelerator PHP DAY 18/12/2010 7
  8. 8. 2.3 Server Configuration• Apache – MPM, remove .htaccess, GZip, ETag, Cache control• PHP – Maximum memory, maximum execution time…• MySQL – Slow SQL log PHP DAY 18/12/2010 8
  9. 9. 2.4 Optimize code & loganalysis• Demo XDebug• Other debug statement – pint_r($x) , print_r($x, true) – var_dump() – thow new Exception() – debug_print_backtrace() – microtime(true) – … PHP DAY 18/12/2010 9
  10. 10. 3. Minimizing round-triptimes• Use brower’s cache• User external CSS & javascript• Avoid 404 error• Combine CSS & JS file• Use CDN (Content delivery network)• Parallel download PHP DAY 18/12/2010 10
  11. 11. 3.1 Use brower’s cache PHP DAY 18/12/2010 11
  12. 12. 3.2 User external CSS &javascript PHP DAY 18/12/2010 12
  13. 13. 3.3 Avoid 404 error PHP DAY 18/12/2010 13
  14. 14. 4.4 Combine CSS & JS fileGOODBAD PHP DAY 18/12/2010 14
  15. 15. 4.5 Use CDN PHP DAY 18/12/2010 15
  16. 16. 3.6 Parallel download PHP DAY 18/12/2010 16
  17. 17. 4. Minimizing request /response size• Use a cookieless domain for static content• Use GZip• Minify HTML, CSS, Javascript• Optimize Image (and favicon.ico) PHP DAY 18/12/2010 17
  18. 18. 4.1 Use a cookieless domain for staticcontent PHP DAY 18/12/2010 18
  19. 19. 4.2 Use GZip PHP DAY 18/12/2010 19
  20. 20. 4.3 Minify HTML, CSS, JS PHP DAY 18/12/2010 20
  21. 21. 4.4 Optimize images• Do not use BMPs or TIFFs• Use PNG, GIF for small image or simple graphics• Use JPG for photo• Reduce the size of image to fit with display area• Use small & cacheable favicon.ico PHP DAY 18/12/2010 21
  22. 22. 5. Optimizing brower rendering• Put CSS on top, javascript on bottom• Specify image size• Post load & Pre load• Use smart event handle – Use $(“a”).click(function(){}); thay cho <a href= “javascript: …” PHP DAY 18/12/2010 22
  23. 23. 6. Tools for Optimizing XDebug & WinCacheGrind PHP DAY 18/12/2010 23
  24. 24. 6. Tools for Optimizing (Cont) https://addons.mozilla.org/en-US/firefox/addon/1843/http://code.google.com/speed/page-speed/download.html https://addons.mozilla.org/en-US/firefox/addon/5369/ PHP DAY 18/12/2010 24
  25. 25. Reference• http://code.google.com/speed/page-speed/docs/rules_intro.html• http://developer.yahoo.com/performance/rules.html• http://www.xdebug.org/• https://addons.mozilla.org/en-US/firefox/addon/1843/• http://developer.yahoo.com/yslow/• http://code.google.com/speed/page-speed/• http://sourceforge.net/projects/wincachegrind PHP DAY 18/12/2010 25
  26. 26. Thanks ! 26
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×