DRUPAL PERFORMANCE A Surgical Approach 1 1 @mandclu MARTIN - - PowerPoint PPT Presentation

▶
drupal performance
SMART_READER_LITE
LIVE PREVIEW

DRUPAL PERFORMANCE A Surgical Approach 1 1 @mandclu MARTIN - - PowerPoint PPT Presentation

Sep 13, 2022 232 likes •829 views

DRUPAL PERFORMANCE A Surgical Approach 1 1 @mandclu MARTIN ANDERSON-CLUTZ 2 PERFORMANCE 3 SHOULD YOU CARE? Amazon - every 100ms of latency cost 1% in sales - Shopzilla speeding up their site by 5 seconds: - conversion

slide-1
SLIDE 1

1 1

DRUPAL PERFORMANCE

A Surgical Approach

slide-2
SLIDE 2

2

MARTIN

@mandclu ANDERSON-CLUTZ

slide-3
SLIDE 3

3

PERFORMANCE

slide-4
SLIDE 4
  • Amazon - every 100ms of latency cost 1% in sales
  • Shopzilla – speeding up their site by 5 seconds:
  • conversion rate: +7-12%
  • sessions from SEM: +100%
  • required servers: -50%
  • COOK - reducing page load time by 0.85 seconds increased

conversions by 7%

SHOULD YOU CARE?

4

slide-5
SLIDE 5
  • Speed is a ranking factor
  • Mobile since 9 Jul 2018
  • Desktop since 2010
  • Speed is a crawling factor
  • Crawl budget
  • Crawl rate

SPEED FOR SEO

5

slide-6
SLIDE 6

SPEED VS RETENTION

6

Bounce Rate (%)

0.0 15.0 30.0 45.0 60.0

Load Time (seconds)

2.5 5 7.5 10

12.8% 20% 58%

Source: Akamai

slide-7
SLIDE 7

POTENTIAL FACTORS

7

  • Server
  • Code
  • Number of modules
  • Complexity of modules
  • Custom code
  • Configuration
  • Caching
  • Assets
  • Third-party assets and services
slide-8
SLIDE 8

A SURGICAL APPROACH

8

Test Diagnose Operate Monitor

slide-9
SLIDE 9

9

TEST

slide-10
SLIDE 10

DEFINE THE PROBLEM

10

IDENTIFY

Which pages 
 need attention?

ISOLATE

Where in the page(s) does it

  • ccur?

DELINEATE

What can/can’t 
 be changed in 
 the site?

slide-11
SLIDE 11

DELINEATE

11

  • “Nice to haves” vs. true requirements
  • Remarketing pixels
  • Social widgets
  • Carousels
slide-12
SLIDE 12

12

http://shouldiuseacarousel.com/

slide-13
SLIDE 13

13

“Simplicity is the ultimate sophistication.”

slide-14
SLIDE 14

IDENTIFY - GOOGLE ANALYTICS

14

slide-15
SLIDE 15

IDENTIFY - SCREAMING FROG

15

slide-16
SLIDE 16

ISOLATE

16

  • Run detailed tests to determine where in each page the

slowdown(s) occur:

  • Page Load
  • On-Site Assets
  • 3rd Parties
slide-17
SLIDE 17

17

slide-18
SLIDE 18

18

slide-19
SLIDE 19

19

slide-20
SLIDE 20

20

DIAGNOSE

slide-21
SLIDE 21

PAGE LOAD

21

slide-22
SLIDE 22

GO DEEP

22

  • Site Audit (contrib module/drush command)
  • New Relic (commercial / free on Pantheon)
  • Blackfire (commercial)
slide-23
SLIDE 23

23

slide-24
SLIDE 24

24

slide-25
SLIDE 25

25

slide-26
SLIDE 26

26

slide-27
SLIDE 27

27

slide-28
SLIDE 28

28

slide-29
SLIDE 29

29

slide-30
SLIDE 30

30

slide-31
SLIDE 31

31

slide-32
SLIDE 32

IMPROVING PAGE LOAD

32

  • Data
  • Remove external loads
  • Views show SQL query,

EXPLAIN

  • Page Content
  • Break into more pages
  • Keep markup clean
  • Load hidden content via

AJAX instead

slide-33
SLIDE 33

IMPROVING FIRST BYTE

33

  • Server
  • CPU, RAM
  • PHP 7.1+
  • Varnish
  • Data Cache 


(APCu, etc.)


  • Cache
  • Page caching
  • Views output cache
  • Views data cache
slide-34
SLIDE 34

MODULES!

34

  • Consider adding:
  • BigPipe
  • Fast 404
  • Syslog
  • Purge
  • Uninstall:
  • AS MANY AS POSSIBLE!
  • Devel
  • UI Modules
  • Statistics
  • Search?
  • Database log


(in favour of syslog)

  • PHP Filter
slide-35
SLIDE 35

ON-SITE ASSETS

35

slide-36
SLIDE 36

ON-SITE ASSETS

36

  • Images!
  • Keep small
  • Responsive images esp.

for banners

  • Optimize
  • Compress aggressively
  • Lazy load
  • CSS and JS
  • Use only what’s necessary
  • Aggregate
  • Compress and minify
  • Render-blocking elements

at end of page

  • Content Delivery Network

(CDN)

slide-37
SLIDE 37

GO DEEP

37

  • Lighthouse audit (Chrome)
  • Page Speed Insights (Google)
slide-38
SLIDE 38

38

slide-39
SLIDE 39

39

slide-40
SLIDE 40

40

slide-41
SLIDE 41

MODULES!

41

  • Advanced Aggregation
  • Responsive Image
  • Image Optimize/Kraken
  • Image Lazyloader
  • CDN
slide-42
SLIDE 42

3RD PARTIES

42

slide-43
SLIDE 43

3RD PARTIES

43

  • Use as few as possible
  • r load on user interaction
  • Cache and serve with local assets


(ideally via CDN)

  • Consider aggregator services, especially for social
  • sharethis, addtoany, etc.
slide-44
SLIDE 44

MODULES

44

  • AddToAny
  • Relocator (part of AdvAgg)
slide-45
SLIDE 45

45

OPERATE

slide-46
SLIDE 46

MAKE IT SO

46

  • Don’t do everything at once
  • Make changes in small increments
  • Test and measure before and after deploying
  • Iterate quickly
  • Start with quick wins
slide-47
SLIDE 47

EFFORT VS IMPACT

47

Impact

Low High

Effort

Low High

slide-48
SLIDE 48

48

MONITOR

slide-49
SLIDE 49

MONITOR

49

  • Performance metrics as part of site health
  • CI integration
  • New Relic
  • Blackfire
  • Sitespeed.io
  • Modules:
  • Monitoring
  • Performance monitor
slide-50
SLIDE 50

50

slide-51
SLIDE 51

51

slide-52
SLIDE 52

52

slide-53
SLIDE 53

#DRUPALCONTRIBUTIONS

53

Join us for contribution opportunities

Friday, April 12, 2019

Mentored Contributions 9:00-18:00 Room: 602 First Time Contributor Workshop General Contributions 9:00-12:00 Room: 606 9:00-18:00 Room: 6A

slide-54
SLIDE 54

WHAT DID YOU THINK?

54

Locate this session at the DrupalCon Seattle website: http://seattle2019.drupal.org/schedule Take the Survey! https://www.surveymonkey.com/r/DrupalConSeattle

slide-55
SLIDE 55

<SHAMELESS PLUG>

55

slide-56
SLIDE 56

56

COMMENTS Q QUESTIONS

slide-57
SLIDE 57

57

THANKS!

slide-58
SLIDE 58

58

slide-59
SLIDE 59

59