Make Your Site SpEEdy
Improving the performance of
your ExpressionEngine website




                            Prepared ...
Part I: Tools and techniques for

Measuring Performance
What impacts site speed?

1. Browser rendering time               4. Filesystem disk accessing time
2. Component transmiss...
What impacts site speed?

1. Browser rendering time               4. Filesystem disk accessing time
2. Component transmiss...
1      2


Page render time and component load time

can be measured with YSlow and/or Google Page Speed for Firebug.
    ...
3


Server-side script execution

can be measured by enabling EE’s Template Debugging.


                            In EE...
5


Database queries

can be seen by enabling EE’s output profiler. Note that this doesn’t tell us
how long a single query ...
Part 2: Recommendations for

Improving Performance
The site optimization cycle




     Measure
   performance.
  (“Benchmark.”)     Identify the
                     bigges...
What impacts site speed?

1. Browser rendering time               4. Filesystem disk accessing time
2. Component transmiss...
1


Browser rendering time optimizations

• Make your Javascript and CSS more efficient, so the browser
  is able to render...
2


Component transmission time optimizations

• Minify and concatenate all JavaScript into a single file, and
  minify and...
2


Component transmission time optimizations (con’t)

• Serve optimized images.
  • Prevent content maintainers from uplo...
3


Server-side script execution optimizations

• Cache individual tags.
  • Tag caches are time-based, set in minutes. Us...
3


Server-side script execution optimizations (con’t)

• Where possible, use Global Variables and Snippets instead of
  e...
4


Filesystem optimizations

• Don’t save templates as flat files.
  • Why? “Saving templates as files can marginally increa...
5


Database query optimizations

• Set the database connection to non-persistent.
  • In EE2, set Persistent Database Con...
5


Database query optimizations (con’t)

• Enable dynamic channel query caching.
  • Only enable if your site doesn’t use...
5


Database query optimizations (con’t)

• Repair and optimize EE’s MySQL tables.
  • In EE1, look under Admin › Utilitie...
Part 3:

More Resources
Online Resources

• ExpressionEngine.com User Guide
  • http://expressionengine.com/user_guide/general/caching.html
  • ht...
Books

• High Performance Web Sites, by Steve Souders:
 http://www.amazon.com/gp/product/0596529309

• Even Faster Web Sit...
Nearby Groups

• Boston Web Performance Group:
  http://www.meetup.com/Web-Performance-Boston/
Thanks!

http://twitter.com/BostonEErs

http://BostonEErs.org
Upcoming SlideShare
Loading in...5
×

Make Your Site SpEEdy

7,476

Published on

How to improve the performance of your ExpressionEngine website. Written by me, with contributions from the awesome attendees at the BostonEErs September 2010 event: http://www.meetup.com/BostonEErs/calendar/14247978/

Published in: Technology
0 Comments
12 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
7,476
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
91
Comments
0
Likes
12
Embeds 0
No embeds

No notes for slide

Make Your Site SpEEdy

  1. 1. Make Your Site SpEEdy Improving the performance of your ExpressionEngine website Prepared by Ruthie BenDor for the BostonEErs September 2010 Meetup
  2. 2. Part I: Tools and techniques for Measuring Performance
  3. 3. What impacts site speed? 1. Browser rendering time 4. Filesystem disk accessing time 2. Component transmission time 5. Database query execution time 3. Server-side script execution 1 3 2 5 Server-side Browser Database scripts Filesystem 4 Web server
  4. 4. What impacts site speed? 1. Browser rendering time 4. Filesystem disk accessing time 2. Component transmission time 5. Database query execution time 3. Server-side script execution 1 3 2 5 Expression Browser HTML MySQL Engine fragments, CSS files, Javascript files, images Filesystem 4 Web server
  5. 5. 1 2 Page render time and component load time can be measured with YSlow and/or Google Page Speed for Firebug. (Also useful: Webkit’s Developer Tools.)
  6. 6. 3 Server-side script execution can be measured by enabling EE’s Template Debugging. In EE 1.6.x’s Control Panel: Admin › System Preferences › Output and Debugging Preferences In EE 2.1’s Control Panel: Admin › System Administration › Output and Debugging
  7. 7. 5 Database queries can be seen by enabling EE’s output profiler. Note that this doesn’t tell us how long a single query takes to run, but it does show us the full query. In EE 1.6.x’s Control Panel: Admin › System Preferences › Output and Debugging Preferences In EE 2.1’s Control Panel: Admin › System Administration › Output and Debugging
  8. 8. Part 2: Recommendations for Improving Performance
  9. 9. The site optimization cycle Measure performance. (“Benchmark.”) Identify the biggest (or easiest-to-fix) bottleneck. Remove that bottleneck.
  10. 10. What impacts site speed? 1. Browser rendering time 4. Filesystem disk accessing time 2. Component transmission time 5. Database query execution time 3. Server-side script execution 1 3 2 5 Expression Browser HTML MySQL Engine fragments, CSS files, Javascript files, images Filesystem 4 Web server
  11. 11. 1 Browser rendering time optimizations • Make your Javascript and CSS more efficient, so the browser is able to render (draw) the completed page more quickly. • For writing faster CSS, check out OOCSS: http://wiki.github.com/stubbornella/oocss/ • For writing faster JavaScript, speed-test snippets using JSPerf: http://jsperf.com/
  12. 12. 2 Component transmission time optimizations • Minify and concatenate all JavaScript into a single file, and minify and concatenate all CSS into a single file. • If you keep your Javascript and CSS in EE templates, concatenate these assets using this technique: http://easy-reader.net/archives/2010/07/11/ template-based-asset-munging-in-expressionengine • To concatenate and minify JS/CSS in EE templates, try SL Combinator http://experienceinternet.co.uk/software/sl-combinator/docs/, which uses an old version of Minify http://code.google.com/p/minify/ • If you keep your JS and CSS assets outside of EE, use Minify http:// code.google.com/p/minify/
  13. 13. 2 Component transmission time optimizations (con’t) • Serve optimized images. • Prevent content maintainers from uploading content images that are too large by using http://www.lumis.com/page/imgsizer/ • Run all site image assets through http://smush.it/ to reduce filesize as much as possible. • Where possible, combine (aka sprite) site image assets. • Enable GZIP compression in EE. In EE 1.6.x’s Control Panel: Admin › System Preferences › In EE 2.1’s Control Panel: Output and Debugging Preferences Admin › System Administration › Output and Debugging
  14. 14. 3 Server-side script execution optimizations • Cache individual tags. • Tag caches are time-based, set in minutes. Use on any EE tag like so: {exp:some:tag cache="yes" refresh="30"} • Cache entire templates. • Enabled on a per-template basis. In EE1, look in Templates > Preferences. In EE2, look in Design > Templates > Template Preferences. • Template caches are time-based, mostly - certain events will clear the cache: http://expressionengine.com/user_guide/general/caching.html#template_caching • Template caching supercedes tag caching, so if you’re caching the entire template, there’s no reason to also cache individual tags. • A cached template in EE is still heavier, performance-wise, than a 100% static page served from outside EE.
  15. 15. 3 Server-side script execution optimizations (con’t) • Where possible, use Global Variables and Snippets instead of embedded templates. • Snippets can contain EE tags, while Global Variables can contain only HTML. • Snippets are EE2-only. • Why Snippets are faster than embedded templates: http://www.meetup.com/BostonEErs/messages/boards/thread/9783637 • Where possible, avoid nesting embedded templates.
  16. 16. 4 Filesystem optimizations • Don’t save templates as flat files. • Why? “Saving templates as files can marginally increase disk 1/o as teach template must be retrieved from disk in addition to the standard database query responsible for managing your template’s meta data (access, PHP parsing, template type, etc.)” - http://expressionengine.com/user_guide/ general/handling_extreme_traffic.html • But flat files are really convenient during development! • Suggestion: work with templates as flat files during development. At site launch, sync all templates back to the database, and set all templates to no longer save as flat files. How? • In EE2, use the built-in Synchronize Templates tool under Design > Templates. • In EE1, either sync manually, or use the free DC Template Manager module: http://devot-ee.com/add-ons/dc-template-manager/
  17. 17. 5 Database query optimizations • Set the database connection to non-persistent. • In EE2, set Persistent Database Connection to No at Admin › System Administration › Database Settings • In EE1, set Database Connection Type to Non Persistent at Admin › System Preferences › Database Settings • Reduce the number of queries each page calls. • http://expressionengine.com/wiki/Reduce_Queries/ • Cache frequently used queries. • In EE2, set Enable SQL Query Caching to Yes at Admin › System Administration › Database Settings • In EE1, set Enable SQL Query Caching to Yes at Admin › System Preferences › Database Settings
  18. 18. 5 Database query optimizations (con’t) • Enable dynamic channel query caching. • Only enable if your site doesn’t use future, expiring, or random entries. • In EE1, set Cache Dynamic Channel Queries? to Yes at Admin › Weblog Administration › Global Weblog Preferences. • In EE2, set Cache Dynamic Channel Queries? to Yes at Admin › Channel Administration › Global Preferences. • Disable unused parts of {exp:channel:entries} queries. • In EE1, six things can be disabled: {exp:channel:entries disable="categories| category_fields|custom_fields|member_data|pagination|trackbacks"} • In EE2, trackbacks have been removed, so five things can be disabled: {exp:channel:entries disable="categories|category_fields|custom_fields| member_data|pagination"}
  19. 19. 5 Database query optimizations (con’t) • Repair and optimize EE’s MySQL tables. • In EE1, look under Admin › Utilities › SQL Manager › Manage Database Tables. • In EE2, look under Tools › Data › SQL Manager › Manage Database Tables. • Disable template tracking. • In EE1, look under Admin › System Preferences › Tracking Preferences. • In EE2, these options must be set manually in config.php.
  20. 20. Part 3: More Resources
  21. 21. Online Resources • ExpressionEngine.com User Guide • http://expressionengine.com/user_guide/general/caching.html • http://expressionengine.com/user_guide/general/ handling_extreme_traffic.html • http://expressionengine.com/user_guide/templates/flat_file_templates.html • http://expressionengine.com/legacy_docs/cp/admin/system_preferences/ tracking_preferences.html • SolSpace’s EE Website Performance Guidelines • http://www2.grist.org/misc/Performance_Guidelines.pdf
  22. 22. Books • High Performance Web Sites, by Steve Souders: http://www.amazon.com/gp/product/0596529309 • Even Faster Web Sites, also by Steve Souders: http://www.amazon.com/gp/product/0596522304
  23. 23. Nearby Groups • Boston Web Performance Group: http://www.meetup.com/Web-Performance-Boston/
  24. 24. Thanks! http://twitter.com/BostonEErs http://BostonEErs.org
  1. A particular slide catching your eye?

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

×