SlideShare une entreprise Scribd logo
1  sur  103
Télécharger pour lire hors ligne
LOTS OF LITTLE THINGSMAKING A SITE FAST EVERYWHERE
Ian Lurie
CEO & Founder, Portent, Inc.
@portentint
Lots of Little Things: Site Speed, 2017
I’M NOT A
LAS VEGAS GUY
@portentint
7 second load time
9 second load time
So what?
Lots of Little Things: Site Speed, 2017
HERE’S THE THING
WHY?
$-
$10.00
$20.00
$30.00
1 2 3 4 5 6 7 8 9
Load time (seconds)
Page Value vs. Load Time
TOOLS
Every tool interprets results & has bias
Pagespeed Insights: B
@portentint
Webpagetest.org: > 8 seconds
Webpagetest.org: B+
@portentintPingdom.com: B+
Learn to read the HTTP Archive (HAR)
A+++++++
Resource-by-resource view
Separates DOM content load from
Full load
@portentint
View >> Developer >> Developer Tools >> Network
check out
these guns,
baby
Time to get to work
TRANSMISSION
more
compression
next time…
Use the right image format
1
PNG format, 800 x 540: 1,000kb
PNG format, 800 x 540: 1,000kb
@portentint
JPG: 30kb
PNG: 13kb
why won’t
anyone do
this?!!!
@portentint
700kb png 64kb jpg
JPG = Photos
PNG = Fewer colors, like logos
Compress images
2
@portentint
HAR
Compression tools
Imageoptim (Mac)
Caesium (PC)
Fireworks/Photoshop
@portentint
272kb jpg
@portentint
139kb jpg
@portentint
1.2kb
@portentint
.4kb
JPGs: Start with 60%
PNGs: Start with 256 color
@portentint
Combining techniques
Lots of Little Things: Site Speed, 2017
@portentint
350kb
150kb
No text, no logos in jpgs!!!
Layering instead: 150kb, sharper image
Minify
3
Not minified: 260kb
Minified: 84kb
Use .MIN.JS version of javascript libraries
Google javascript libraries
https://developers.google.com/speed/libraries/
Use GZIP Compression
4
@portentint
Hey, thanks! I’ll
extract it here.
I’m going to
compress these
files for you so
they arrive more
quickly.
@portentint
<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file .(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler ^cgi-script$
mod_gzip_item_include mime ^text/.*
mod_gzip_item_include mime ^application/x-javascript.*
…
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
</ifModule>
Apache
@portentint
gzip on;
gzip_comp_level 2;
gzip_http_version 1.0;
gzip_proxied any;
gzip_min_length 1100;
gzip_buffers 16 8k;
gzip_types text/plain text/html text/css application/x-
javascript text/xml application/xml application/xml+rss
text/javascript;
nginx
@portentint
IIS
☑︎
@portentint
CHECKGZIPCOMPRESSION.COM
@portentint
The Result
Original home page: 4.1mb
New home page: 1.75mb
Original home page: 3.7mb
New home page: 1.5mb
Use a CDN
(not a bandwidth thing)
5
@portentint
hellloooooo
No CDN
@portentint
CDN
Use CDN javascript libraries
https://developers.google.com/speed/libraries/
SERVING
a bit to the
left, please…
I better get a
tip for this
@portentint
Time to First Byte
Time between request and
delivery of first data
@portentint
what the
hell?!!!!
Lots of Little Things: Site Speed, 2017
Use Caching
6
@portentint
Sure!
may i have
index.html?
No Caching
Request
Starts
Queries database
Generates page
Response
@portentint
i’m thinking…
any time now…
No Caching
@portentint
STORED ON DISK
@portentint
STORED IN MEMORY
Bypasses this
@portentint
Apache: Memcached
IIS: Check a box
nginx: Memcached
RENDERING
well, $#&!
The Critical Rendering Path
Hi There!!! Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
yep. here’s the
first bit…
can i get
thispage.html?
0s 2s
Hi There!!! Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
can i get
thispage.html?
and the text...
and what you
need to make it
look good
0s 2s
Hi There!!! Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
can i get
thispage.html?
and the first
image…
and what you
need to make it
look good
0s 2s
Hi There!!! Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
can i get
thispage.html?
and the other
stuff
and what you
need to make it
look good
0s 2s
can i get
thispage.html?
Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non sunt in culpa qui officia
deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
Hi There!!!
Lorem ipsum dolor sit amet, consectetur
adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud
exercitation ullamco laboris nisi ut aliquip ex ea
commodo consequat. Duis aute irure dolor in
reprehenderit in voluptate velit esse cillum
dolore eu fugiat nulla pariatur. Excepteur sint
occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu
fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui
officia deserunt mollit anim id est laborum.
here’s
the images the
text the scripts
and everything
else good
luck
0s 2s
Lots of Little Things: Site Speed, 2017
Oy.
Optimize HTML
7
@portentint
35,000 lines of code
Render time: 1.5s
html: 900kb
why?
At least get rid of the white space
Your browser has to load and parse it
Prioritize content
8
Only load javascript you
need, when you need it
@portentint
<script src=”foo.js" async></script>
Execute asynchronously
@portentint
<script src=”foo.js" defer></script>
Execute after page is parsed
@portentint
Or just put it at the bottom of the page!!!
@portentint
Javascript after CSS, always
Inline Critical CSS
Inline this
Browser can do basic
rendering without
another request
GETTING BUY IN
The Drag Race
Be ready to explain actual vs.
perceived load time
WHY?
$-
$10.00
$20.00
$30.00
1 2 3 4 5 6 7 8 9
Load time (seconds)
Page Value vs. Load Time
Prove value
Incremental improvement
Caching servers
Defer via javascript
Progressive video load
Code acceleration
CSS optimization
Javascript optimization
Server-side/db optimization
IT’S LOTS OF
LITTLE THINGS
Ian Lurie
@portentint
www.portent.com
http://portent.co/speedy-sites
http://portent.co/page-speed-guide
Donations Accepted (small bills only)

Contenu connexe

Tendances

Contoh Slide Presentasi Skripsi yang Baik dan Menarik (Terbaru di Tahun 2015)
Contoh Slide Presentasi Skripsi yang Baik dan Menarik (Terbaru di Tahun 2015)Contoh Slide Presentasi Skripsi yang Baik dan Menarik (Terbaru di Tahun 2015)
Contoh Slide Presentasi Skripsi yang Baik dan Menarik (Terbaru di Tahun 2015)Mustofa Thovids
 
Power user templates - november 2016
Power user templates - november 2016Power user templates - november 2016
Power user templates - november 2016Power-user
 

Tendances (6)

Modelo de Presentación
Modelo de PresentaciónModelo de Presentación
Modelo de Presentación
 
Csr report
Csr report Csr report
Csr report
 
Contoh Slide Presentasi Skripsi yang Baik dan Menarik (Terbaru di Tahun 2015)
Contoh Slide Presentasi Skripsi yang Baik dan Menarik (Terbaru di Tahun 2015)Contoh Slide Presentasi Skripsi yang Baik dan Menarik (Terbaru di Tahun 2015)
Contoh Slide Presentasi Skripsi yang Baik dan Menarik (Terbaru di Tahun 2015)
 
Power user templates - november 2016
Power user templates - november 2016Power user templates - november 2016
Power user templates - november 2016
 
Renewable energy
Renewable energyRenewable energy
Renewable energy
 
Travel
Travel Travel
Travel
 

Similaire à Lots of Little Things: Site Speed, 2017

PPT Format that can be used for presentaton.
PPT Format that can be used for presentaton.PPT Format that can be used for presentaton.
PPT Format that can be used for presentaton.AmitKumarBiswas22
 
Akapity
AkapityAkapity
Akapitynatan
 
Presentación de Proyecto Científico Ilustrado Rosa y Gris_20231011_024124_000...
Presentación de Proyecto Científico Ilustrado Rosa y Gris_20231011_024124_000...Presentación de Proyecto Científico Ilustrado Rosa y Gris_20231011_024124_000...
Presentación de Proyecto Científico Ilustrado Rosa y Gris_20231011_024124_000...RickySnchez5
 
Diseño sin título DE CANVA CIENTIFICO MODELO
Diseño sin título DE CANVA CIENTIFICO MODELODiseño sin título DE CANVA CIENTIFICO MODELO
Diseño sin título DE CANVA CIENTIFICO MODELOcristina198035
 
Design: discovering the child's mind.pptx
Design: discovering the child's mind.pptxDesign: discovering the child's mind.pptx
Design: discovering the child's mind.pptxJooAlves15560
 
Colorful Organic Child Psychology Presentation.pptx
Colorful Organic Child Psychology Presentation.pptxColorful Organic Child Psychology Presentation.pptx
Colorful Organic Child Psychology Presentation.pptxGiselleSaldaa2
 
Kanan Presentation Template for business proposal
Kanan Presentation Template for business proposalKanan Presentation Template for business proposal
Kanan Presentation Template for business proposalRioAditya39
 
Beige Illustrated Writie Presentation_20240226_210132_0000.pdf
Beige Illustrated Writie Presentation_20240226_210132_0000.pdfBeige Illustrated Writie Presentation_20240226_210132_0000.pdf
Beige Illustrated Writie Presentation_20240226_210132_0000.pdfjosegarnicacardoso
 
Orange Doodle Project Presentation upload slideshare
Orange Doodle Project Presentation upload slideshareOrange Doodle Project Presentation upload slideshare
Orange Doodle Project Presentation upload slidesharehimanshusharma252069
 

Similaire à Lots of Little Things: Site Speed, 2017 (20)

TPi.pptx
TPi.pptxTPi.pptx
TPi.pptx
 
NOCK look & feel
NOCK look & feelNOCK look & feel
NOCK look & feel
 
PPT Format that can be used for presentaton.
PPT Format that can be used for presentaton.PPT Format that can be used for presentaton.
PPT Format that can be used for presentaton.
 
Akapity
AkapityAkapity
Akapity
 
Presentación de Proyecto Científico Ilustrado Rosa y Gris_20231011_024124_000...
Presentación de Proyecto Científico Ilustrado Rosa y Gris_20231011_024124_000...Presentación de Proyecto Científico Ilustrado Rosa y Gris_20231011_024124_000...
Presentación de Proyecto Científico Ilustrado Rosa y Gris_20231011_024124_000...
 
Diseño sin título DE CANVA CIENTIFICO MODELO
Diseño sin título DE CANVA CIENTIFICO MODELODiseño sin título DE CANVA CIENTIFICO MODELO
Diseño sin título DE CANVA CIENTIFICO MODELO
 
Design: discovering the child's mind.pptx
Design: discovering the child's mind.pptxDesign: discovering the child's mind.pptx
Design: discovering the child's mind.pptx
 
Legal services ala Carte
Legal services ala CarteLegal services ala Carte
Legal services ala Carte
 
Presentation Template.pptx
Presentation Template.pptxPresentation Template.pptx
Presentation Template.pptx
 
newspaper.pptx
newspaper.pptxnewspaper.pptx
newspaper.pptx
 
book.pptx
book.pptxbook.pptx
book.pptx
 
book.pptx
book.pptxbook.pptx
book.pptx
 
Colorful Organic Child Psychology Presentation.pptx
Colorful Organic Child Psychology Presentation.pptxColorful Organic Child Psychology Presentation.pptx
Colorful Organic Child Psychology Presentation.pptx
 
Kanan Presentation Template for business proposal
Kanan Presentation Template for business proposalKanan Presentation Template for business proposal
Kanan Presentation Template for business proposal
 
Traballo congreso
Traballo congresoTraballo congreso
Traballo congreso
 
Traballo congreso
Traballo congresoTraballo congreso
Traballo congreso
 
Beige Illustrated Writie Presentation_20240226_210132_0000.pdf
Beige Illustrated Writie Presentation_20240226_210132_0000.pdfBeige Illustrated Writie Presentation_20240226_210132_0000.pdf
Beige Illustrated Writie Presentation_20240226_210132_0000.pdf
 
2020 wireframe tab
2020 wireframe tab2020 wireframe tab
2020 wireframe tab
 
diseño 2.pptx
diseño 2.pptxdiseño 2.pptx
diseño 2.pptx
 
Orange Doodle Project Presentation upload slideshare
Orange Doodle Project Presentation upload slideshareOrange Doodle Project Presentation upload slideshare
Orange Doodle Project Presentation upload slideshare
 

Plus de Ian Lurie

Data Visualization For Marketers
Data Visualization For MarketersData Visualization For Marketers
Data Visualization For MarketersIan Lurie
 
Starting, Running, And Selling An Agency: Life Among The Monsters
Starting, Running, And Selling An Agency: Life Among The MonstersStarting, Running, And Selling An Agency: Life Among The Monsters
Starting, Running, And Selling An Agency: Life Among The MonstersIan Lurie
 
Core Web Vitals and SEO: Don't Panic. Improve.
Core Web Vitals and SEO: Don't Panic. Improve.Core Web Vitals and SEO: Don't Panic. Improve.
Core Web Vitals and SEO: Don't Panic. Improve.Ian Lurie
 
Big Content, Small Teams: Content Creation For The Real World
Big Content, Small Teams: Content Creation For The Real WorldBig Content, Small Teams: Content Creation For The Real World
Big Content, Small Teams: Content Creation For The Real WorldIan Lurie
 
Teaching SEO To Internal Teams: Don't Be Ridiculous
Teaching SEO To Internal Teams: Don't Be RidiculousTeaching SEO To Internal Teams: Don't Be Ridiculous
Teaching SEO To Internal Teams: Don't Be RidiculousIan Lurie
 
E-A-T: Myths, Truths, And Implications for SEO
E-A-T: Myths, Truths, And Implications for SEOE-A-T: Myths, Truths, And Implications for SEO
E-A-T: Myths, Truths, And Implications for SEOIan Lurie
 
SEO Copywriting: The Blank Sheet Of Paper Test
SEO Copywriting: The Blank Sheet Of Paper TestSEO Copywriting: The Blank Sheet Of Paper Test
SEO Copywriting: The Blank Sheet Of Paper TestIan Lurie
 
Your Content Doesn't Matter Without Technology
Your Content Doesn't Matter Without TechnologyYour Content Doesn't Matter Without Technology
Your Content Doesn't Matter Without TechnologyIan Lurie
 
The Dungeons & Dragons Guide to Marketing
The Dungeons & Dragons Guide to MarketingThe Dungeons & Dragons Guide to Marketing
The Dungeons & Dragons Guide to MarketingIan Lurie
 
Advanced SEO: No More Bullshit
Advanced SEO: No More BullshitAdvanced SEO: No More Bullshit
Advanced SEO: No More BullshitIan Lurie
 
Bullshit, Own It: A Temperamental SEO's Guide To Getting Shit Done
Bullshit, Own It: A Temperamental SEO's Guide To Getting Shit DoneBullshit, Own It: A Temperamental SEO's Guide To Getting Shit Done
Bullshit, Own It: A Temperamental SEO's Guide To Getting Shit DoneIan Lurie
 
Advanced SEO: Logs, Load, and Language
Advanced SEO: Logs, Load, and LanguageAdvanced SEO: Logs, Load, and Language
Advanced SEO: Logs, Load, and LanguageIan Lurie
 
A Beginner's Guide to PPC: Fast Times, Easy Wins, And Burned Money
A Beginner's Guide to PPC: Fast Times, Easy Wins, And Burned MoneyA Beginner's Guide to PPC: Fast Times, Easy Wins, And Burned Money
A Beginner's Guide to PPC: Fast Times, Easy Wins, And Burned MoneyIan Lurie
 
5 Lessons For Entrepreneurs: 2018 Edition
5 Lessons For Entrepreneurs: 2018 Edition5 Lessons For Entrepreneurs: 2018 Edition
5 Lessons For Entrepreneurs: 2018 EditionIan Lurie
 
Advanced Content Workflow Using GitHub and Markdown
Advanced Content Workflow Using GitHub and MarkdownAdvanced Content Workflow Using GitHub and Markdown
Advanced Content Workflow Using GitHub and MarkdownIan Lurie
 
Tip Per Minute: A Hyper-Active SEO Brain Dump
Tip Per Minute: A Hyper-Active SEO Brain DumpTip Per Minute: A Hyper-Active SEO Brain Dump
Tip Per Minute: A Hyper-Active SEO Brain DumpIan Lurie
 
Intelligent CX: 25 Years of Marketing, And Where to Go Next
Intelligent CX: 25 Years of Marketing, And Where to Go NextIntelligent CX: 25 Years of Marketing, And Where to Go Next
Intelligent CX: 25 Years of Marketing, And Where to Go NextIan Lurie
 
Burying Hate Sites in the SERPs
Burying Hate Sites in the SERPsBurying Hate Sites in the SERPs
Burying Hate Sites in the SERPsIan Lurie
 
Marketing Worldbuilding: Collaborative Storytelling for Digital
Marketing Worldbuilding: Collaborative Storytelling for DigitalMarketing Worldbuilding: Collaborative Storytelling for Digital
Marketing Worldbuilding: Collaborative Storytelling for DigitalIan Lurie
 
Lean Content: Marketing Profs B2B
Lean Content: Marketing Profs B2BLean Content: Marketing Profs B2B
Lean Content: Marketing Profs B2BIan Lurie
 

Plus de Ian Lurie (20)

Data Visualization For Marketers
Data Visualization For MarketersData Visualization For Marketers
Data Visualization For Marketers
 
Starting, Running, And Selling An Agency: Life Among The Monsters
Starting, Running, And Selling An Agency: Life Among The MonstersStarting, Running, And Selling An Agency: Life Among The Monsters
Starting, Running, And Selling An Agency: Life Among The Monsters
 
Core Web Vitals and SEO: Don't Panic. Improve.
Core Web Vitals and SEO: Don't Panic. Improve.Core Web Vitals and SEO: Don't Panic. Improve.
Core Web Vitals and SEO: Don't Panic. Improve.
 
Big Content, Small Teams: Content Creation For The Real World
Big Content, Small Teams: Content Creation For The Real WorldBig Content, Small Teams: Content Creation For The Real World
Big Content, Small Teams: Content Creation For The Real World
 
Teaching SEO To Internal Teams: Don't Be Ridiculous
Teaching SEO To Internal Teams: Don't Be RidiculousTeaching SEO To Internal Teams: Don't Be Ridiculous
Teaching SEO To Internal Teams: Don't Be Ridiculous
 
E-A-T: Myths, Truths, And Implications for SEO
E-A-T: Myths, Truths, And Implications for SEOE-A-T: Myths, Truths, And Implications for SEO
E-A-T: Myths, Truths, And Implications for SEO
 
SEO Copywriting: The Blank Sheet Of Paper Test
SEO Copywriting: The Blank Sheet Of Paper TestSEO Copywriting: The Blank Sheet Of Paper Test
SEO Copywriting: The Blank Sheet Of Paper Test
 
Your Content Doesn't Matter Without Technology
Your Content Doesn't Matter Without TechnologyYour Content Doesn't Matter Without Technology
Your Content Doesn't Matter Without Technology
 
The Dungeons & Dragons Guide to Marketing
The Dungeons & Dragons Guide to MarketingThe Dungeons & Dragons Guide to Marketing
The Dungeons & Dragons Guide to Marketing
 
Advanced SEO: No More Bullshit
Advanced SEO: No More BullshitAdvanced SEO: No More Bullshit
Advanced SEO: No More Bullshit
 
Bullshit, Own It: A Temperamental SEO's Guide To Getting Shit Done
Bullshit, Own It: A Temperamental SEO's Guide To Getting Shit DoneBullshit, Own It: A Temperamental SEO's Guide To Getting Shit Done
Bullshit, Own It: A Temperamental SEO's Guide To Getting Shit Done
 
Advanced SEO: Logs, Load, and Language
Advanced SEO: Logs, Load, and LanguageAdvanced SEO: Logs, Load, and Language
Advanced SEO: Logs, Load, and Language
 
A Beginner's Guide to PPC: Fast Times, Easy Wins, And Burned Money
A Beginner's Guide to PPC: Fast Times, Easy Wins, And Burned MoneyA Beginner's Guide to PPC: Fast Times, Easy Wins, And Burned Money
A Beginner's Guide to PPC: Fast Times, Easy Wins, And Burned Money
 
5 Lessons For Entrepreneurs: 2018 Edition
5 Lessons For Entrepreneurs: 2018 Edition5 Lessons For Entrepreneurs: 2018 Edition
5 Lessons For Entrepreneurs: 2018 Edition
 
Advanced Content Workflow Using GitHub and Markdown
Advanced Content Workflow Using GitHub and MarkdownAdvanced Content Workflow Using GitHub and Markdown
Advanced Content Workflow Using GitHub and Markdown
 
Tip Per Minute: A Hyper-Active SEO Brain Dump
Tip Per Minute: A Hyper-Active SEO Brain DumpTip Per Minute: A Hyper-Active SEO Brain Dump
Tip Per Minute: A Hyper-Active SEO Brain Dump
 
Intelligent CX: 25 Years of Marketing, And Where to Go Next
Intelligent CX: 25 Years of Marketing, And Where to Go NextIntelligent CX: 25 Years of Marketing, And Where to Go Next
Intelligent CX: 25 Years of Marketing, And Where to Go Next
 
Burying Hate Sites in the SERPs
Burying Hate Sites in the SERPsBurying Hate Sites in the SERPs
Burying Hate Sites in the SERPs
 
Marketing Worldbuilding: Collaborative Storytelling for Digital
Marketing Worldbuilding: Collaborative Storytelling for DigitalMarketing Worldbuilding: Collaborative Storytelling for Digital
Marketing Worldbuilding: Collaborative Storytelling for Digital
 
Lean Content: Marketing Profs B2B
Lean Content: Marketing Profs B2BLean Content: Marketing Profs B2B
Lean Content: Marketing Profs B2B
 

Lots of Little Things: Site Speed, 2017

  • 1. LOTS OF LITTLE THINGSMAKING A SITE FAST EVERYWHERE
  • 2. Ian Lurie CEO & Founder, Portent, Inc. @portentint
  • 4. I’M NOT A LAS VEGAS GUY
  • 10. WHY? $- $10.00 $20.00 $30.00 1 2 3 4 5 6 7 8 9 Load time (seconds) Page Value vs. Load Time
  • 11. TOOLS
  • 12. Every tool interprets results & has bias
  • 14. @portentint Webpagetest.org: > 8 seconds Webpagetest.org: B+
  • 16. Learn to read the HTTP Archive (HAR) A+++++++
  • 20. @portentint View >> Developer >> Developer Tools >> Network
  • 22. Time to get to work
  • 24. Use the right image format 1
  • 25. PNG format, 800 x 540: 1,000kb
  • 26. PNG format, 800 x 540: 1,000kb
  • 27. @portentint JPG: 30kb PNG: 13kb why won’t anyone do this?!!!
  • 29. JPG = Photos PNG = Fewer colors, like logos
  • 32. Compression tools Imageoptim (Mac) Caesium (PC) Fireworks/Photoshop
  • 37. JPGs: Start with 60% PNGs: Start with 256 color
  • 41. 350kb
  • 42. 150kb
  • 43. No text, no logos in jpgs!!!
  • 44. Layering instead: 150kb, sharper image
  • 48. Use .MIN.JS version of javascript libraries
  • 52. Hey, thanks! I’ll extract it here. I’m going to compress these files for you so they arrive more quickly.
  • 53. @portentint <ifModule mod_gzip.c> mod_gzip_on Yes mod_gzip_dechunk Yes mod_gzip_item_include file .(html?|txt|css|js|php|pl)$ mod_gzip_item_include handler ^cgi-script$ mod_gzip_item_include mime ^text/.* mod_gzip_item_include mime ^application/x-javascript.* … mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.* </ifModule> Apache
  • 54. @portentint gzip on; gzip_comp_level 2; gzip_http_version 1.0; gzip_proxied any; gzip_min_length 1100; gzip_buffers 16 8k; gzip_types text/plain text/html text/css application/x- javascript text/xml application/xml application/xml+rss text/javascript; nginx
  • 58. Original home page: 4.1mb New home page: 1.75mb
  • 59. Original home page: 3.7mb New home page: 1.5mb
  • 60. Use a CDN (not a bandwidth thing) 5
  • 63. Use CDN javascript libraries https://developers.google.com/speed/libraries/
  • 64. SERVING a bit to the left, please… I better get a tip for this
  • 65. @portentint Time to First Byte Time between request and delivery of first data
  • 78. Hi There!!! Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. yep. here’s the first bit… can i get thispage.html? 0s 2s
  • 79. Hi There!!! Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. can i get thispage.html? and the text... and what you need to make it look good 0s 2s
  • 80. Hi There!!! Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. can i get thispage.html? and the first image… and what you need to make it look good 0s 2s
  • 81. Hi There!!! Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. can i get thispage.html? and the other stuff and what you need to make it look good 0s 2s
  • 82. can i get thispage.html? Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Hi There!!! Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat ctat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. here’s the images the text the scripts and everything else good luck 0s 2s
  • 84. Oy.
  • 86. @portentint 35,000 lines of code Render time: 1.5s html: 900kb
  • 87. why?
  • 88. At least get rid of the white space Your browser has to load and parse it
  • 90. Only load javascript you need, when you need it
  • 93. @portentint Or just put it at the bottom of the page!!!
  • 96. Inline this Browser can do basic rendering without another request
  • 99. Be ready to explain actual vs. perceived load time
  • 100. WHY? $- $10.00 $20.00 $30.00 1 2 3 4 5 6 7 8 9 Load time (seconds) Page Value vs. Load Time Prove value
  • 101. Incremental improvement Caching servers Defer via javascript Progressive video load Code acceleration CSS optimization Javascript optimization Server-side/db optimization