to a search results page can decrease traffic and ad revenues by 20 percent (Google) • Amazon found that every additional 100 milliseconds of load time decreased sales by 1 percent!!
max-‐clients in h-pd.conf (prevents hard drive swap space usage) (Total Memory -‐ Opera?ng System Memory -‐ MySQL memory) / Size Per Apache process 4096MB -‐ 512MB -‐ 2048MB / 100MB = 15 Max-‐Clients
• Percona Configura?on Wizard = Great Start! (h-ps://tools.percona.com/wizard) • Use Innodb (this is the default for D7) • Increase Innodb Buffer Size! • MySQL Query Cache • Check your slow query logs!
Caching! Breakdown of Drupal's Performance Admin Cache pages for anonymous users: Stores en?re HTML in cache db table (or memcached/redis). Also, enables external caching (Varnish, Browser). Cache Blocks: Basic caching for blocks. Note that blocks created by views must be explicitly enabled for caching. Amount of Bme before page cache is cleared. Note! This needs to be enabled for Block Cache! Uses PHP library to Gzip html. KEEP THESE CHECKED DAMNIT! :) Only affects external caches (Varnish, browers). Sets cache-‐control max-‐age value.
results for set ?me period (does what you think it does). Rendered Output Cache: Does not cache db query. This will query the db (or query results cache), and if there is no change it will output rendered html. If there *is* a change, it will regenerate and cache resul?ng html.
another crappy host? • Boost h-p://drupal.org/project/boost Does what Varnish does – but doesn’t require external service. This will work on most shared hosts and will drama?cally speed up anonymous page requests! (Plus it has 26 essen:al vitamins & minerals!)
• Authcache h-p://drupal.org/project/authcache Aoer a page is loaded by the browser, a second HTTP request may be performed via Ajax. This ini?ates a lightweight DRUPAL_BOOTSTRAP_ SESSION that allows SQL queries to be executed, and returns any user-‐customized data to the page .
En?ty Cache h-p://drupal.org/project/en?tycache Useful ONLY for large site with lots of fields and references your en?ty types. Mostly useful for scalability. Good discussion at h-p://groups.drupal.org/node/292348
ImageAPI Op?mize h-p://drupal.org/project/imageapi_op?mize Losslessly op?mizes an image when it is saved. o Supports 3rd party services. o Integrates into D7 core's image styles.
CSS/JS Aggrega?on h-p://drupal.org/project/advagg/ Just released stable version for 7.x this month!!! Lots of cool features: o Pre-‐gzipped and compressed css,js o Bundle css, js into one or more file o Minifica?on o Much more!
h-p://drupal.org/project/devel o Query Log o XHProf support (must have XHProf installed on server) o Page Timer o Memory Usage • Performance Logging and Monitoring h-p://drupal.org/project/performance o Enables awesome performance logs o Can log directly to DB -‐ only do this on dev sites o On live sites can log to cache services (memcache, apc, etc)
is the one not made." -‐ Chris Coyier* • Modern Browsers are limited to 6 parallel connec?ons (per server) • Design and Theme your website with HTTP Requests in mind • CSS Image Sprites • Inline Images (Base64 encoding) • Icon Fonts
Combine all CSS background images into one image. • Use CSS's background-‐posi?on property to move the background image into correct placement • PITA (but worth it) • Sass & Compass do it for free! (YA-‐ AAAYYY!!) h-p://compass-‐style.org/reference/compass/ helpers/sprites/
• Saves an HTTP Request! :) • But, it makes your CSS or HTML file longer :( • Unless... you make sure the files are being compressed by your web server. The total size will (about) even out in the end! :) • But, its a PITA ...you have to upload your image to a website that converts it. :( • Unless... you use Sass/Compass! inline-‐image("../images/background-‐pa-ern.png") :)
• 6 parallel HTTP requests per server o Use Google CDN for Jquery! Its free and browser may already have it cached! h-ps://github.com/mherchel/bastard/blob/master/template.php template.php
Use a Content Delivery Network! CDNs can spread assets across mul?ple servers: sta?c1.yourcdn.com sta?c2.yourcdn.com ... Also, CDNs can serve assets from loca?ons that are physically closer to you. This is a huge win in the war against latency! THE ASSETS! CDN ALL
your CSS will follow. -‐ Lara Swanson at h-p://alistapart.com/ar?cle/improving-‐ux-‐ through-‐front-‐end-‐performance • Not so easy to do in Drupal! So, here's some easy ?ps: o Create or use a minimal base theme. Don't get stuck with unnecessary wrapper elements (Looking at you Omega 3.x!). o Modify Views to output seman?c HTML Elements o Or use the Fences Module! h-p://drupal.org/project/fences
is gzipping sta?c assets! • Make sure sta?c assets are able to be cached by your browser! • Op?mize your images! (use that image api op?mizer module or do it manually) • Use JPGs instead of PNGs when you can • Don't use a lot of images! • Don't load unnecessary images in mobile css (progressive enhancement) • Use responsive image solu?ons o Borealis Responsive Images (h-ps://drupal.org/project/borealis) o Clientside Adap?ve Images (h-ps://drupal.org/project/cs_adap?ve_image)
your selectors to as li-le as possible • Don't use elements as selectors. Use IDs or classes instead. • This is baaaadd... • Use Instead of • Limit CSS3 selectors (:nth-‐child(), :last-‐child, etc) h-p://css-‐tricks.com/efficiently-‐rendering-‐css/
performance! • JS execu?on take approx 10x longer on mobile devices (due to less RAM and CPU) • Async and deferred JS execu?on -‐ h-p://www.html5rocks.com/ en/tutorials/async/deferred/ and h-p://peter.sh/experiments/asynchronous -‐and-‐deferred-‐javascript-‐execu?on-‐explained/ • h-p://jsperf.com -‐ aims to provide an easy way to create and share test cases, comparing the perform-‐ ance of different JS snippets by running benchmarks.
• Beginner's Guide to Caching Data in Drupal 7 (in code) h-p://www.lullabot.com/blog/ar?cles/beginners-‐guide-‐caching-‐data-‐drupal-‐7 • Top 15 Drupal performance ?ps h-p://www.netmagazine.com/features/top-‐15-‐drupal-‐performance-‐?ps • DrupalCon Sydney: Performance Tough Love h-p://www.youtube.com/watch?v=WoFBAGHvAFA
& Scalability by Nate Haug (This is awesome)h-p://drupalize.me/videos/overview-‐performance-‐scalability • Every damned thing on 2bits.com h-p://2bits.com/ • ...including Xen vs Virtuozzo (Cloud compu?ng) h-p://2bits.com/ar?cles/common-‐issues-‐and-‐solu?ons-‐dealing-‐cloud-‐ compu?ng-‐and-‐vps-‐performance-‐issues-‐drupal.html
-‐ Steve Souders (Lots of great JS op?miza?on ?ps)h-p://stevesouders.com/ • Presenta?on: Even Faster Websites (Steve Souders) h-p://www.slideshare.net/souders/sxsw-‐even-‐faster-‐web-‐sites • Let’s Do Simple Stuff to Make Our Websites Faster (Chris Coyier) h-p://css-‐tricks.com/video-‐screencasts/114-‐lets-‐do-‐simple-‐stuff-‐to-‐make-‐our-‐websites-‐faster/
aoerparty in the lobby • Thanks to Drupalcamp Atlanta and all its awesome sponsors! • The date for Florida Drupalcamp has been announced! March 8th in Winter Park! • Go Gators (beat Mizzou)!! • I'm on Twi-er at @mikeherchel • And, Remember….
mherchel
nagix
kzkmaeda
thomasvitale
tomu28
rainerhahnekamp
linyixian
bkuhlmann
nakamuuu
toshi_atsumi
yuyatakeyama
ch1aki
kniino
danielanewman
sonatard
addyosmani
speakerdeck
lauravandoore
nonsquared
stephaniewalter
morganepeng
trishagee
matthewcrist
swwweet
![@mikeherchel Quick Chrome Tools Overview [Demo Time!]](https://files.speakerdeck.com/presentations/c6f13fe0a61d01311c805ee0f6c297c9/slide_53.jpg){kind=link}
