Make Your Site SpEEdy

  • 7,320 views
Uploaded 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: …

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/

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
7,320
On Slideshare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
90
Comments
0
Likes
12

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. Make Your Site SpEEdy Improving the performance of your ExpressionEngine website Prepared by Ruthie BenDor for the BostonEErs September 2010 Meetup
  • 2. Part I: Tools and techniques for Measuring Performance
  • 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. 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. 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. 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. 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. Part 2: Recommendations for Improving Performance
  • 9. The site optimization cycle Measure performance. (“Benchmark.”) Identify the biggest (or easiest-to-fix) bottleneck. Remove that bottleneck.
  • 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. Part 3: More Resources
  • 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. 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. Nearby Groups • Boston Web Performance Group: http://www.meetup.com/Web-Performance-Boston/
  • 24. Thanks! http://twitter.com/BostonEErs http://BostonEErs.org