This document outlines 5 steps to achieve a 100% mobile PageSpeed score according to Google guidelines: 1. Ensure clean code by selecting lightweight page builders, plugins, and themes to reduce page bloat. 2. Install a page speed plugin like WP Rocket to optimize JavaScript loading and defer scripts. 3. Upgrade the web host to improve server response time (TTFB) which impacts all page speed metrics. 4. Improve the Largest Contentful Paint score by preloading images, enabling compression, and disabling lazy loading for critical elements. 5. Improve the Time to Interactive score by removing unnecessary sections of the page using the isolation technique to diagnose bottlenecks. Optimizing script

1. LINKEDIN.COM/IN/JOSEPHWILLIAMS/
@JOETHESEO
Google PageSpeed:
5 Steps to 100%
(Mobile) Success
Joe Williams | Tribe SEO

2. #brightonSEO
@joetheseo
A rich media
webpage

3. BEFORE AFTER
100
37

4. Lab data vs Field data
#brightonSEO
@joetheseo

5. Lab Data is real-time, so
use it when optimising.
#brightonSEO
@joetheseo
Field Data is real-life, Google
uses it when ranking.

6. STEP #1:
Ensure Clean Code
#brightonSEO
@joetheseo

7. #brightonSEO
@joetheseo
PLUGINS
e.g. Gravity Forms
PAGE BUILDER
e.g. Elementor
THEME
e.g. Hello
CMS
e.g. Wordpress
Web Server

8. 250 KB
Brizy
Pro
Divi
Builder
Elementor
Pro
WP Page/Site Builders: Page Size (CSS + JS files combined)
WP
Baker
Beaver
Builder
Oxygen
Builder
500 KB
750 KB
1000 KB
1250 KB
1500 KB
Source: Oxygen4fun (May 2021)
34 KB

9. 100 KB
ARForms WS Form
Pro
Gravity
Forms
WP Form Plugins: Page Size (CSS + JS files combined)
WPforms WP Fluent
Forms Pro
200 KB
300 KB
400 KB
500 KB
Source: Oxygen4fun (May 2021)
41.8 KB
Happy
Forms Pro

10. Elegant code is
bloat free:
#brightonSEO
@joetheseo
Your choice of CMS, page
builder & plugins play a crucial
role in page size & page speed.

11. STEP #2:
Install a Page
Speed Plugin
#brightonSEO
@joetheseo

12. #brightonSEO
@joetheseo
1
2 3
My Top 3 WordPress Page Speed Plugins

13. 2.4 s
Before After
Largest Contentful Paint
Time to Interactive
Total Blocking Time
2.8 s
30 ms
6 s
Largest Contentful Paint
Time to Interactive 11.4 s
Total Blocking Time 1,080 ms

14. #brightonSEO
@joetheseo
But why are
the scores so
slow without
WP Rocket?
I thought
Oxygen Builder
was fast..?

15. #brightonSEO
@joetheseo
JavaScript from
other plugins
affected our
scores…
Live chat widget
Email widget
Video player

16. WP Rocket allows
deferring and delaying
of JavaScript.

17. Disabling deferring and
delaying JavaScript saw
the PageSpeed score
dropped from 97% to 50%.

18. Defer long
JavaScript requests:
#brightonSEO
@joetheseo
While page speed plugins offer
many features, the ones that
optimise JavaScript the best
make the biggest difference.

19. STEP #3:
Upgrade Webhost
#brightonSEO
@joetheseo

20. #brightonSEO
@joetheseo
“Before anything else, improve
how and where your server
handles your content. Use
Time to First Byte (TTFB) to
measure your server response
times.”

21. #brightonSEO
@joetheseo
LIVE TV
Who has qualified for
the September
debates, so far
Only eight candidates have already qualified for
the third Democratic debate hosted by ABC and
Univision
How to make money with merch from a viral debate
moment
Anderson Cooper: This is the question for 2020
Democrats
Whether you trust scientists may depend on your
political party, survey says
Server
Client
TTFB measures the length of
time between a Client making
its request from a browser and
receiving the first byte of data
from the Server.

22. #brightonSEO
@joetheseo
 Optimize the server's application
logic to prepare pages faster
 Optimize how your server queries
databases
 Upgrade your server hardware to
have more memory or CPU
How to Improve TTFB
(aka Server Response Time)

24. 2.1 s
Before After
Largest Contentful Paint
Time to Interactive
Cumulative Layout Shift
2.5 s
0
2.4 s
Largest Contentful Paint
Time to Interactive 2.8 s
Cumulative Layout Shift 0

25. #brightonSEO
@joetheseo
TTFB Improvements
(aka Server Response Time)
Tested on
bytecheck.com
TTFB: 194 ms TTFB: 96 ms

26. TTFB impacts all
page speed metrics:
#brightonSEO
@joetheseo
Boosting TTFB, by upgrading
your hosting or refining your
coding, can boost all Google
PageSpeed performance
metrics.

27. STEP #4:
Improve Largest
Contentful Paint
#brightonSEO
@joetheseo

28. #brightonSEO
@joetheseo
Largest Contentful Paint (LCP) is
an important, user-centric metric
for measuring perceived load
speed because it marks the point
in the page load timeline when
the page's main content has
likely loaded.
Largest Contentful Paint

29. Use the Lighthouse Scoring Calculator
to See What Areas Need Improving
V7 was the
current version
when I ran my
early tests.

30. LCP

31. Improve
Largest Contentful Paint
Tip #1: Preload LCP Image

33. Improve
Largest Contentful Paint
Tip #2: Ensure Server-Side
Compression

34. 13 KB
Uncompressed
SVG

36. Cloudways Tech Support (Cloudways Ticketing System)
Apr 12, 2021, 11:32 AM GMT+5
Hi there,
I hope you are doing well.
Other compression is by default enabled.
SVG compression was not enabled which has now been enabled for you on your server.
If you require any further assistance, you may feel free to contact us, we are available 24/7.
Kind Regards

37. BEFORE:
13 KB
Uncompressed SVG
AFTER:
3.9 KB
Compressed SVG
Enabling Server-Side Compression

38. Improve
Largest Contentful Paint
Tip #3: Disable Lazy Loading
for the LCP Element

40. 1.8 s
Before After
Largest Contentful Paint
2.1 s
Largest Contentful Paint
Preloading LCP image provided significant gains in LCP score

41. LCP = 25% of your
PageSpeed score:
#brightonSEO
@joetheseo
While you can optimise an LCP
image, you’ll often find bigger
gains when optimising TTFB.

42. STEP #5:
Improve Time to
Interactive
#brightonSEO
@joetheseo

43. #brightonSEO
@joetheseo
Time to Interactive (TTI)
measures how long it
takes a page to
become fully interactive.
Time to Interactive

44. Empty Full
Page Speed Ideas

45. #NotCovidRelated
The isolation page
speed technique

46. Header
Sidebar
Main
Content
Footer

47. Background CSS image not lazy loaded

49. Rather than optimise individual
resources, remove a section of
the page (or a plugin) and test
the page speed again to
diagnose the biggest bottlenecks.
The isolation page
speed technique:

50. V3.8
V7
V3.9
V8

51. #brightonSEO
@joetheseo
Joe, do I need a
100% mobile
score? Okay but what
score should I
aim for?

52. #brightonSEO
@joetheseo
~ TBT (lab data)
Page Experience Signal: All Core Web Vitals
(May) Need to Be Met

53. Ensure Clean
Code
#1.
Install a Page
Speed Plugin
#2.
Upgrade
Webhost
#3.
Improve Time
To Interactive
#5.
Improve Largest
Contentful Paint
#4.

54. The secret page
speed ingredient:
#brightonSEO
@joetheseo
How your website handles
scripts, both client-side and
server-side, can make or break
how fast your website loads.

55. Tribe SEO Cloudways
5 Day “Quick Win”
SEO Challenge
www.tribeseo.com/challenge
Webhost Page
Speed Challenge
www.cloudways.com/challenge

56. LINKEDIN.COM/IN/JOSEPHWILLIAMS/
@JOETHESEO
Google PageSpeed:
5 Steps to 100%
(Mobile) Success
Joe Williams | Tribe SEO