The document provides recommendations for improving the performance of ExpressionEngine websites. It discusses measuring performance using tools like YSlow and Google Page Speed, and then identifies bottlenecks like browser rendering time, component load time, server-side script execution time, filesystem access time, and database query time. It offers optimizations in each of these areas, such as concatenating and minifying JavaScript and CSS, using caching, reducing database queries, and optimizing images and templates. Additional resources like ExpressionEngine documentation, books on web performance, and local meetup groups are also mentioned.
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
Speed Up Your EE Site
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
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.
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/