SlideShare a Scribd company logo
1 of 84
Enough with the
JavaScript
Already!
Nicholas C. Zakas
@slicknet
@slicknet
2004
2005
http://www.adaptivepath.com/ideas/ajax-new-approach-web-applications
2006
2007
Atwood’s Law
Any application that can be
written in JavaScript,
will eventually be written in
JavaScript.
http://www.codinghorror.com/blog/2007/07/the-principle-of-least-power.html
2013
“Help, Nicholas! Our
JavaScript is killing our
site performance!”
- Everyone who contacted me while consulting
> 1 MB*
JavaScript loaded during page load
* Un-gzipped
Server HTML CSS JavaScript
Rendering
HTML
Constructing
URLs
Calculating
dependencies
Redirecting
Document
structure
Native
functionality
Accessibility
Layout
Colors
Visibility
Animation
Handling
Events
Ajax
Changing UI
Server HTML CSS JavaScript
Rendering
HTML
Constructing
URLs
Calculating
dependencies
Redirecting
Document
structure
Native
functionality
Accessibility
Layout
Colors
Visibility
Animation
Handling
Events
Ajax
Changing UI
Source: HTTP Archive
256 KB
260 KB 993.96 KB
793.5 KB
1570.4 KB503 KB
196 KB 568.7 KB
Gzipped Un-gzipped
Time Spent During a Project
0%
10%
20%
30%
40%
50%
60%
70%
80%
90%
100%
HTML
CSS
JavaScript
Client-Side
Rendering
Hogan.js{dust.js}
EJS
MVW
Model
View
Whatever™
“It's no longer good
enough to build web
apps around full page
loads and then
progressively enhance
them to behave more
dynamically.”
- throneofjs.com
https://www.facebook.com/help/189391594506832/
“To improve the twitter.com experience for everyone,
we've been working to take back control of our front-end
performance by moving the rendering to the server.
This has allowed us to drop our initial page load times
to 1/5th of what they were previously and reduce
differences in performance across browsers.”
https://blog.twitter.com/2012/improving-performance-twittercom
“Our thesis [was] if we have a JavaScript runtime on the server, we should be able to
pull most of this application logic back down to the server in a way that can be
shared with the client. Your great new product can run on both sides of the wire, serving
up real HTML on first pageload, but then kicking off a client-side JavaScript app.”
http://nerds.airbnb.com/weve-launched-our-first-nodejs-app-to-product
“…we re-launched our Mobile Web site using this new stack, replacing the Backbone.js
+ Rails stack that it used previously...It looks exactly the same as the app it
replaced, however initial pageload feels drastically quicker because we serve up real
HTML instead of waiting for the client to download JavaScript before rendering. Plus, it
is fully crawlable by search engines.”
http://nerds.airbnb.com/weve-launched-our-first-nodejs-app-to-product
The server &
browser are better
at this than us
Progressive
enhancement still
works
Unused JavaScript
60-65%
JavaScript that was not executed by page load*
* My consulting clients
The 4 JavaScript Load Times
In <head>
Before </body>
After page load
On demand
Prerequisite:
What are the top
2-3 things users do
on this page?
aka Prerequisite:
Analytics!
In <head>
https://support.google.com/analytics/answer/1008080?hl=en
“Once you find the code snippet, copy and paste it into your web page, just before the
closing </head> tag*. If your website uses templates to generate pages, enter it just
before the closing </head> tag in the file that contains the<head> section.”
Scripts needed by
page load
Before </body>
Before </body>
Scripts needed soon
after page load
After page load
After page load
In reaction to user
On demand
On demand
http://alexsexton.com/blog/2013/03/deploying-javascript-applications/
http://alexsexton.com/blog/2013/03/deploying-javascript-applications/
JavaScript Libraries
(they are big)
42.3 KB 115.0 KB
27.7 KB 90.9 KB
29.0 KB 81.5 KB
85.3 KB25.7 KB
Gzipped Un-gzipped
2.x
1.x
Library Code Component Code
Library Code Component Code
Library Code Component Code
Library Code Component Code
As JS Libraries Develop
0
2
4
6
8
10
12
14
16
0
10
20
30
40
50
60
70
80
90
100
Library Code
Component Code
Number of Components
JS Libraries and Economies of Scale
Cost per
JavaScript
component
Number of components
Library Code Component Code
Tabs
Tabs?
63.1 KB 120.8 KB
95.3 KB30.2 KB
Gzipped Un-gzipped
1.x
1.9 KB 5.0 KB
How?
Step 1
Include HTML on
the page
<div data-nui-type="tabview" class="nui-tabview">
<ol class="nui-tabs clearfix">
<li><a href="#">Tab 1</a></li>
<li><a href="#">Tab 2</a></li>
<li><a href="#">Tab 3</a></li>
</ol>
<div class="nui-tabpanels">
<div><p>Content 1</p></div>
<div><p>Content 2</p></div>
<div><p>Content 3</p></div>
</div>
</div>
No JS
yet!
Step 2
Store UI state on
the DOM
<div data-nui-type="tabview" class="nui-tabview">
<ol class="nui-tabs clearfix">
<li class="nui-selected"><a href="#">Tab 1</a></li>
<li><a href="#">Tab 2</a></li>
<li><a href="#">Tab 3</a></li>
</ol>
<div class="nui-tabpanels">
<div class="nui-selected"><p>Content 1</p></div>
<div><p>Content 2</p></div>
<div><p>Content 3</p></div>
</div>
</div>
Selected
tab
Selected
panel
No JS
yet!
Step 3
Sprinkle in some JS
<script>
nui.init();
</script>
One call to
initialize all
instances
// none of this
var tabview = new MyLibrary.TabView("#tabs", { selected: 1 });
// none of this
$(“#tabs”).tabs();
Just add
more
HTML!
<div data-nui-type="tabview" class="nui-tabview" data-nui-selected-
index="0">
<ol class="nui-tabs clearfix" role="tablist">
<li class=" nui-selected" data-nui-index="0"><a id="nui0">Tab
1</a></li>
<li data-nui-index="1"><a id="nui1">Tab 2</a></li>
<li data-nui-index="2"><a id="nui2">Tab 3</a></li>
</ol>
<div class="nui-tabpanels">
<div class=" nui-selected"><p>Content 1</p></div>
<div><p>Content 2</p></div>
<div><p>Content 3</p></div>
</div>
</div>
Sure, but I bet
there’s no
accessibility
Wrong
<div data-nui-type="tabview" class="nui-tabview" data-nui-selected-
index="0">
<ol class="nui-tabs clearfix" role="tablist">
<li class=" nui-selected" data-nui-index="0"
role="presentation"><a id="nui0" role="tab" tabindex="0">Tab
1</a></li>
<li data-nui-index="1" role="presentation"><a id="nui1"
role="tab" tabindex="-1">Tab 2</a></li>
<li data-nui-index="2" role="presentation"><a id="nui2"
role="tab" tabindex="-1">Tab 3</a></li>
</ol>
<div class="nui-tabpanels">
<div class=" nui-selected" role="tabpanel" aria-
labelledby="nui0" tabindex="0"><p>Content 1</p></div>
<div role="tabpanel" aria-labelledby="nui1" tabindex="-1"
aria-hidden="true"><p>Content 2</p></div>
<div role="tabpanel" aria-labelledby="nui2" tabindex="-1"
aria-hidden="true"><p>Content 3</p></div>
</div>
</div>
What the JavaScript does
1. Look for tabviews via data-nui-type
2. Read UI state based on classes
3. Annotate DOM with additional information
4. Use event delegation to watch for user
interaction
5. Swap classes to react to events
https://github.com/nzakas/nui
Conclusion
Awesome!
OK
OK
Bad!
Bytes
Value
Server HTML CSS JavaScript
Rendering
HTML
Constructing
URLs
Calculating
dependencies
Redirecting
Document
structure
Native
functionality
Accessibility
Layout
Colors
Visibility
Animation
Handling
Events
Ajax
Changing UI
The 4 JavaScript Load Times
• Primarily analytics
• Small seed filesIn <head>
• Anything needed by page load
• Minimal as possibleBefore </body>
• Anything needed soon afterAfter page load
• Anything needed as a result of user actionOn demand
JS Libraries and Economies of Scale
Cost per
JavaScript
component
Number of components
42.3 KB 115.0 KB
27.7 KB 90.9 KB
29.0 KB 81.5 KB
85.3 KB25.7 KB
Gzipped Un-gzipped
2.x
1.x
Thank you
Etcetera
• My blog: nczonline.net
• Twitter: @slicknet
• These Slides: slideshare.net/nzakas

More Related Content

What's hot

2022 February Patch Tuesday
2022 February Patch Tuesday2022 February Patch Tuesday
2022 February Patch TuesdayIvanti
 
PyQGIS와 PyQt를 이용한 QGIS 기능 확장
PyQGIS와 PyQt를 이용한 QGIS 기능 확장PyQGIS와 PyQt를 이용한 QGIS 기능 확장
PyQGIS와 PyQt를 이용한 QGIS 기능 확장MinPa Lee
 
A Git Workflow Model or Branching Strategy
A Git Workflow Model or Branching StrategyA Git Workflow Model or Branching Strategy
A Git Workflow Model or Branching StrategyVivek Parihar
 
(WEB304) Running and Scaling Magento on AWS | AWS re:Invent 2014
(WEB304) Running and Scaling Magento on AWS | AWS re:Invent 2014(WEB304) Running and Scaling Magento on AWS | AWS re:Invent 2014
(WEB304) Running and Scaling Magento on AWS | AWS re:Invent 2014Amazon Web Services
 
MongoDB Fundamentals
MongoDB FundamentalsMongoDB Fundamentals
MongoDB FundamentalsMongoDB
 
오딘: 발할라 라이징 MMORPG의 성능 최적화 사례 공유 [카카오게임즈 - 레벨 300] - 발표자: 김문권, 팀장, 라이온하트 스튜디오...
오딘: 발할라 라이징 MMORPG의 성능 최적화 사례 공유 [카카오게임즈 - 레벨 300] - 발표자: 김문권, 팀장, 라이온하트 스튜디오...오딘: 발할라 라이징 MMORPG의 성능 최적화 사례 공유 [카카오게임즈 - 레벨 300] - 발표자: 김문권, 팀장, 라이온하트 스튜디오...
오딘: 발할라 라이징 MMORPG의 성능 최적화 사례 공유 [카카오게임즈 - 레벨 300] - 발표자: 김문권, 팀장, 라이온하트 스튜디오...Amazon Web Services Korea
 
Artifacts management with DevOps
Artifacts management with DevOpsArtifacts management with DevOps
Artifacts management with DevOpsChen-Tien Tsai
 
Docker Introduction
Docker IntroductionDocker Introduction
Docker IntroductionHao Fan
 
Debugging concurrency programs in go
Debugging concurrency programs in goDebugging concurrency programs in go
Debugging concurrency programs in goAndrii Soldatenko
 
ViewModel テスト難しすぎ問題 by saiki iijima in Android Test Night #9
ViewModel テスト難しすぎ問題 by saiki iijima in Android Test Night #9ViewModel テスト難しすぎ問題 by saiki iijima in Android Test Night #9
ViewModel テスト難しすぎ問題 by saiki iijima in Android Test Night #9Saiki Iijima
 
Version Control with Git for Beginners
Version Control with Git for BeginnersVersion Control with Git for Beginners
Version Control with Git for Beginnersbryanbibat
 
LX 공간정보아카데미 PostGIS 강의자료
LX 공간정보아카데미 PostGIS 강의자료LX 공간정보아카데미 PostGIS 강의자료
LX 공간정보아카데미 PostGIS 강의자료JungHwan Yun
 
10 minute command line apps with zio cli
10 minute command line apps with zio cli10 minute command line apps with zio cli
10 minute command line apps with zio cliAiswarya Prakasan
 
Windows vs linux prsentsn
Windows vs linux prsentsnWindows vs linux prsentsn
Windows vs linux prsentsnAnadi Vatsa
 
QGIS 소개 및 ArcMap과의 비교
QGIS 소개 및 ArcMap과의 비교QGIS 소개 및 ArcMap과의 비교
QGIS 소개 및 ArcMap과의 비교BJ Jang
 
Introducing GitLab (June 2018)
Introducing GitLab (June 2018)Introducing GitLab (June 2018)
Introducing GitLab (June 2018)Noa Harel
 
Envoy 를 이용한 코드 배포 자동화
Envoy 를 이용한 코드 배포 자동화Envoy 를 이용한 코드 배포 자동화
Envoy 를 이용한 코드 배포 자동화Juwon Kim
 
Original slides from Ryan Dahl's NodeJs intro talk
Original slides from Ryan Dahl's NodeJs intro talkOriginal slides from Ryan Dahl's NodeJs intro talk
Original slides from Ryan Dahl's NodeJs intro talkAarti Parikh
 
Docker 101 - Nov 2016
Docker 101 - Nov 2016Docker 101 - Nov 2016
Docker 101 - Nov 2016Docker, Inc.
 

What's hot (20)

2022 February Patch Tuesday
2022 February Patch Tuesday2022 February Patch Tuesday
2022 February Patch Tuesday
 
PyQGIS와 PyQt를 이용한 QGIS 기능 확장
PyQGIS와 PyQt를 이용한 QGIS 기능 확장PyQGIS와 PyQt를 이용한 QGIS 기능 확장
PyQGIS와 PyQt를 이용한 QGIS 기능 확장
 
A Git Workflow Model or Branching Strategy
A Git Workflow Model or Branching StrategyA Git Workflow Model or Branching Strategy
A Git Workflow Model or Branching Strategy
 
(WEB304) Running and Scaling Magento on AWS | AWS re:Invent 2014
(WEB304) Running and Scaling Magento on AWS | AWS re:Invent 2014(WEB304) Running and Scaling Magento on AWS | AWS re:Invent 2014
(WEB304) Running and Scaling Magento on AWS | AWS re:Invent 2014
 
MongoDB Fundamentals
MongoDB FundamentalsMongoDB Fundamentals
MongoDB Fundamentals
 
오딘: 발할라 라이징 MMORPG의 성능 최적화 사례 공유 [카카오게임즈 - 레벨 300] - 발표자: 김문권, 팀장, 라이온하트 스튜디오...
오딘: 발할라 라이징 MMORPG의 성능 최적화 사례 공유 [카카오게임즈 - 레벨 300] - 발표자: 김문권, 팀장, 라이온하트 스튜디오...오딘: 발할라 라이징 MMORPG의 성능 최적화 사례 공유 [카카오게임즈 - 레벨 300] - 발표자: 김문권, 팀장, 라이온하트 스튜디오...
오딘: 발할라 라이징 MMORPG의 성능 최적화 사례 공유 [카카오게임즈 - 레벨 300] - 발표자: 김문권, 팀장, 라이온하트 스튜디오...
 
Artifacts management with DevOps
Artifacts management with DevOpsArtifacts management with DevOps
Artifacts management with DevOps
 
Docker Introduction
Docker IntroductionDocker Introduction
Docker Introduction
 
Git and Github
Git and GithubGit and Github
Git and Github
 
Debugging concurrency programs in go
Debugging concurrency programs in goDebugging concurrency programs in go
Debugging concurrency programs in go
 
ViewModel テスト難しすぎ問題 by saiki iijima in Android Test Night #9
ViewModel テスト難しすぎ問題 by saiki iijima in Android Test Night #9ViewModel テスト難しすぎ問題 by saiki iijima in Android Test Night #9
ViewModel テスト難しすぎ問題 by saiki iijima in Android Test Night #9
 
Version Control with Git for Beginners
Version Control with Git for BeginnersVersion Control with Git for Beginners
Version Control with Git for Beginners
 
LX 공간정보아카데미 PostGIS 강의자료
LX 공간정보아카데미 PostGIS 강의자료LX 공간정보아카데미 PostGIS 강의자료
LX 공간정보아카데미 PostGIS 강의자료
 
10 minute command line apps with zio cli
10 minute command line apps with zio cli10 minute command line apps with zio cli
10 minute command line apps with zio cli
 
Windows vs linux prsentsn
Windows vs linux prsentsnWindows vs linux prsentsn
Windows vs linux prsentsn
 
QGIS 소개 및 ArcMap과의 비교
QGIS 소개 및 ArcMap과의 비교QGIS 소개 및 ArcMap과의 비교
QGIS 소개 및 ArcMap과의 비교
 
Introducing GitLab (June 2018)
Introducing GitLab (June 2018)Introducing GitLab (June 2018)
Introducing GitLab (June 2018)
 
Envoy 를 이용한 코드 배포 자동화
Envoy 를 이용한 코드 배포 자동화Envoy 를 이용한 코드 배포 자동화
Envoy 를 이용한 코드 배포 자동화
 
Original slides from Ryan Dahl's NodeJs intro talk
Original slides from Ryan Dahl's NodeJs intro talkOriginal slides from Ryan Dahl's NodeJs intro talk
Original slides from Ryan Dahl's NodeJs intro talk
 
Docker 101 - Nov 2016
Docker 101 - Nov 2016Docker 101 - Nov 2016
Docker 101 - Nov 2016
 

Viewers also liked

High Performance JavaScript - Fronteers 2010
High Performance JavaScript - Fronteers 2010High Performance JavaScript - Fronteers 2010
High Performance JavaScript - Fronteers 2010Nicholas Zakas
 
High Performance JavaScript (YUIConf 2010)
High Performance JavaScript (YUIConf 2010)High Performance JavaScript (YUIConf 2010)
High Performance JavaScript (YUIConf 2010)Nicholas Zakas
 
Hypermedia APIs that make sense
Hypermedia APIs that make senseHypermedia APIs that make sense
Hypermedia APIs that make senseRuben Verborgh
 
Knowledgemanagement durch Wikis und Blogs
Knowledgemanagement durch Wikis und BlogsKnowledgemanagement durch Wikis und Blogs
Knowledgemanagement durch Wikis und BlogsJürg Stuker
 
Abgesenkte Bordsteine im Web. Warum von Barrierefreiheit Alle profitieren.
Abgesenkte Bordsteine im Web. Warum von Barrierefreiheit Alle profitieren.Abgesenkte Bordsteine im Web. Warum von Barrierefreiheit Alle profitieren.
Abgesenkte Bordsteine im Web. Warum von Barrierefreiheit Alle profitieren.Martin Kliehm
 
The Object Orientation of Teams
The Object Orientation of TeamsThe Object Orientation of Teams
The Object Orientation of TeamsLisa Welchman
 
Code creativity
Code creativityCode creativity
Code creativityNate Hill
 
LibraryBox and Kickstarter
LibraryBox and KickstarterLibraryBox and Kickstarter
LibraryBox and KickstarterJason Griffey
 
Stories of Discovery: A responsive journey
Stories of Discovery: A responsive journeyStories of Discovery: A responsive journey
Stories of Discovery: A responsive journeySteve Fisher
 
Towards 100% uptime with node
Towards 100% uptime with nodeTowards 100% uptime with node
Towards 100% uptime with nodesandinmyjoints
 
Code and Creativity: Mozilla in Chattanooga
Code and Creativity: Mozilla in ChattanoogaCode and Creativity: Mozilla in Chattanooga
Code and Creativity: Mozilla in ChattanoogaLindsey Frost
 
Making your Angular.js Application accessible
Making your Angular.js Application accessibleMaking your Angular.js Application accessible
Making your Angular.js Application accessibleDirk Ginader
 
Google+ Authorship Publisher Webinar - Search Influence
Google+ Authorship Publisher Webinar - Search InfluenceGoogle+ Authorship Publisher Webinar - Search Influence
Google+ Authorship Publisher Webinar - Search InfluenceSearch Influence
 
SEO Strategy and The Hummingbird Effect
SEO Strategy and The Hummingbird EffectSEO Strategy and The Hummingbird Effect
SEO Strategy and The Hummingbird EffectRobin Leonard
 
Introduction to jQuery Mobile
Introduction to jQuery MobileIntroduction to jQuery Mobile
Introduction to jQuery MobileTroy Miles
 
Google+ Profile PageRank: The Real AuthorRank? - SMX Advanced 2013
Google+ Profile PageRank: The Real AuthorRank? - SMX Advanced 2013Google+ Profile PageRank: The Real AuthorRank? - SMX Advanced 2013
Google+ Profile PageRank: The Real AuthorRank? - SMX Advanced 2013Mark Traphagen
 
The science of landing pages
The science of landing pagesThe science of landing pages
The science of landing pagesUnbounce
 

Viewers also liked (20)

High Performance JavaScript - Fronteers 2010
High Performance JavaScript - Fronteers 2010High Performance JavaScript - Fronteers 2010
High Performance JavaScript - Fronteers 2010
 
High Performance JavaScript (YUIConf 2010)
High Performance JavaScript (YUIConf 2010)High Performance JavaScript (YUIConf 2010)
High Performance JavaScript (YUIConf 2010)
 
Hypermedia APIs that make sense
Hypermedia APIs that make senseHypermedia APIs that make sense
Hypermedia APIs that make sense
 
Git presentation
Git presentationGit presentation
Git presentation
 
Knowledgemanagement durch Wikis und Blogs
Knowledgemanagement durch Wikis und BlogsKnowledgemanagement durch Wikis und Blogs
Knowledgemanagement durch Wikis und Blogs
 
Abgesenkte Bordsteine im Web. Warum von Barrierefreiheit Alle profitieren.
Abgesenkte Bordsteine im Web. Warum von Barrierefreiheit Alle profitieren.Abgesenkte Bordsteine im Web. Warum von Barrierefreiheit Alle profitieren.
Abgesenkte Bordsteine im Web. Warum von Barrierefreiheit Alle profitieren.
 
Hot Links
Hot LinksHot Links
Hot Links
 
The Object Orientation of Teams
The Object Orientation of TeamsThe Object Orientation of Teams
The Object Orientation of Teams
 
Code creativity
Code creativityCode creativity
Code creativity
 
LibraryBox and Kickstarter
LibraryBox and KickstarterLibraryBox and Kickstarter
LibraryBox and Kickstarter
 
Stories of Discovery: A responsive journey
Stories of Discovery: A responsive journeyStories of Discovery: A responsive journey
Stories of Discovery: A responsive journey
 
Towards 100% uptime with node
Towards 100% uptime with nodeTowards 100% uptime with node
Towards 100% uptime with node
 
Code and Creativity: Mozilla in Chattanooga
Code and Creativity: Mozilla in ChattanoogaCode and Creativity: Mozilla in Chattanooga
Code and Creativity: Mozilla in Chattanooga
 
Making your Angular.js Application accessible
Making your Angular.js Application accessibleMaking your Angular.js Application accessible
Making your Angular.js Application accessible
 
Google+ Authorship Publisher Webinar - Search Influence
Google+ Authorship Publisher Webinar - Search InfluenceGoogle+ Authorship Publisher Webinar - Search Influence
Google+ Authorship Publisher Webinar - Search Influence
 
Css3
Css3Css3
Css3
 
SEO Strategy and The Hummingbird Effect
SEO Strategy and The Hummingbird EffectSEO Strategy and The Hummingbird Effect
SEO Strategy and The Hummingbird Effect
 
Introduction to jQuery Mobile
Introduction to jQuery MobileIntroduction to jQuery Mobile
Introduction to jQuery Mobile
 
Google+ Profile PageRank: The Real AuthorRank? - SMX Advanced 2013
Google+ Profile PageRank: The Real AuthorRank? - SMX Advanced 2013Google+ Profile PageRank: The Real AuthorRank? - SMX Advanced 2013
Google+ Profile PageRank: The Real AuthorRank? - SMX Advanced 2013
 
The science of landing pages
The science of landing pagesThe science of landing pages
The science of landing pages
 

Similar to Enough with the JavaScript already!

Building high performance web apps.
Building high performance web apps.Building high performance web apps.
Building high performance web apps.Arshak Movsisyan
 
Build Better Responsive websites. Hrvoje Jurišić
Build Better Responsive websites. Hrvoje JurišićBuild Better Responsive websites. Hrvoje Jurišić
Build Better Responsive websites. Hrvoje JurišićMeetMagentoNY2014
 
Developing High Performance Web Apps - CodeMash 2011
Developing High Performance Web Apps - CodeMash 2011Developing High Performance Web Apps - CodeMash 2011
Developing High Performance Web Apps - CodeMash 2011Timothy Fisher
 
Building performance into the new yahoo homepage presentation
Building performance into the new yahoo  homepage presentationBuilding performance into the new yahoo  homepage presentation
Building performance into the new yahoo homepage presentationmasudakram
 
Performance on the Yahoo! Homepage
Performance on the Yahoo! HomepagePerformance on the Yahoo! Homepage
Performance on the Yahoo! HomepageNicholas Zakas
 
Developing High Performance Web Apps
Developing High Performance Web AppsDeveloping High Performance Web Apps
Developing High Performance Web AppsTimothy Fisher
 
implement lighthouse-ci with your web development workflow
implement lighthouse-ci with your web development workflowimplement lighthouse-ci with your web development workflow
implement lighthouse-ci with your web development workflowWordPress
 
Introduction to Jquery
Introduction to JqueryIntroduction to Jquery
Introduction to JqueryGurpreet singh
 
DrupalCampLA 2011 - Drupal frontend-optimizing
DrupalCampLA 2011 - Drupal frontend-optimizingDrupalCampLA 2011 - Drupal frontend-optimizing
DrupalCampLA 2011 - Drupal frontend-optimizingAshok Modi
 
Our application got popular and now it breaks
Our application got popular and now it breaksOur application got popular and now it breaks
Our application got popular and now it breaksColdFusionConference
 
Our application got popular and now it breaks
Our application got popular and now it breaksOur application got popular and now it breaks
Our application got popular and now it breaksdevObjective
 
MongoDB.local Seattle 2019: MongoDB Stitch Tutorial
MongoDB.local Seattle 2019: MongoDB Stitch TutorialMongoDB.local Seattle 2019: MongoDB Stitch Tutorial
MongoDB.local Seattle 2019: MongoDB Stitch TutorialMongoDB
 
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital MarketersSearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital MarketersDistilled
 
TDC2017 | Florianopolis - Trilha DevOps How we figured out we had a SRE team ...
TDC2017 | Florianopolis - Trilha DevOps How we figured out we had a SRE team ...TDC2017 | Florianopolis - Trilha DevOps How we figured out we had a SRE team ...
TDC2017 | Florianopolis - Trilha DevOps How we figured out we had a SRE team ...tdc-globalcode
 
Business of Front-end Web Development
Business of Front-end Web DevelopmentBusiness of Front-end Web Development
Business of Front-end Web DevelopmentRachel Andrew
 
Client Side Optimization
Client Side OptimizationClient Side Optimization
Client Side OptimizationPatrick Huesler
 

Similar to Enough with the JavaScript already! (20)

Building high performance web apps.
Building high performance web apps.Building high performance web apps.
Building high performance web apps.
 
Build Better Responsive websites. Hrvoje Jurišić
Build Better Responsive websites. Hrvoje JurišićBuild Better Responsive websites. Hrvoje Jurišić
Build Better Responsive websites. Hrvoje Jurišić
 
Developing High Performance Web Apps - CodeMash 2011
Developing High Performance Web Apps - CodeMash 2011Developing High Performance Web Apps - CodeMash 2011
Developing High Performance Web Apps - CodeMash 2011
 
Building performance into the new yahoo homepage presentation
Building performance into the new yahoo  homepage presentationBuilding performance into the new yahoo  homepage presentation
Building performance into the new yahoo homepage presentation
 
Performance on the Yahoo! Homepage
Performance on the Yahoo! HomepagePerformance on the Yahoo! Homepage
Performance on the Yahoo! Homepage
 
Developing High Performance Web Apps
Developing High Performance Web AppsDeveloping High Performance Web Apps
Developing High Performance Web Apps
 
implement lighthouse-ci with your web development workflow
implement lighthouse-ci with your web development workflowimplement lighthouse-ci with your web development workflow
implement lighthouse-ci with your web development workflow
 
Adobe & HTML5
Adobe & HTML5Adobe & HTML5
Adobe & HTML5
 
Introduction to Jquery
Introduction to JqueryIntroduction to Jquery
Introduction to Jquery
 
DrupalCampLA 2011 - Drupal frontend-optimizing
DrupalCampLA 2011 - Drupal frontend-optimizingDrupalCampLA 2011 - Drupal frontend-optimizing
DrupalCampLA 2011 - Drupal frontend-optimizing
 
Taking your Web App for a walk
Taking your Web App for a walkTaking your Web App for a walk
Taking your Web App for a walk
 
Our application got popular and now it breaks
Our application got popular and now it breaksOur application got popular and now it breaks
Our application got popular and now it breaks
 
Our application got popular and now it breaks
Our application got popular and now it breaksOur application got popular and now it breaks
Our application got popular and now it breaks
 
Presentation Tier optimizations
Presentation Tier optimizationsPresentation Tier optimizations
Presentation Tier optimizations
 
MongoDB.local Seattle 2019: MongoDB Stitch Tutorial
MongoDB.local Seattle 2019: MongoDB Stitch TutorialMongoDB.local Seattle 2019: MongoDB Stitch Tutorial
MongoDB.local Seattle 2019: MongoDB Stitch Tutorial
 
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital MarketersSearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
SearchLove San Diego 2018 | Mat Clayton | Site Speed for Digital Marketers
 
TDC2017 | Florianopolis - Trilha DevOps How we figured out we had a SRE team ...
TDC2017 | Florianopolis - Trilha DevOps How we figured out we had a SRE team ...TDC2017 | Florianopolis - Trilha DevOps How we figured out we had a SRE team ...
TDC2017 | Florianopolis - Trilha DevOps How we figured out we had a SRE team ...
 
Html5 & less css
Html5 & less cssHtml5 & less css
Html5 & less css
 
Business of Front-end Web Development
Business of Front-end Web DevelopmentBusiness of Front-end Web Development
Business of Front-end Web Development
 
Client Side Optimization
Client Side OptimizationClient Side Optimization
Client Side Optimization
 

More from Nicholas Zakas

Browser Wars Episode 1: The Phantom Menace
Browser Wars Episode 1: The Phantom MenaceBrowser Wars Episode 1: The Phantom Menace
Browser Wars Episode 1: The Phantom MenaceNicholas Zakas
 
JavaScript APIs you’ve never heard of (and some you have)
JavaScript APIs you’ve never heard of (and some you have)JavaScript APIs you’ve never heard of (and some you have)
JavaScript APIs you’ve never heard of (and some you have)Nicholas Zakas
 
JavaScript Timers, Power Consumption, and Performance
JavaScript Timers, Power Consumption, and PerformanceJavaScript Timers, Power Consumption, and Performance
JavaScript Timers, Power Consumption, and PerformanceNicholas Zakas
 
Scalable JavaScript Application Architecture 2012
Scalable JavaScript Application Architecture 2012Scalable JavaScript Application Architecture 2012
Scalable JavaScript Application Architecture 2012Nicholas Zakas
 
Maintainable JavaScript 2012
Maintainable JavaScript 2012Maintainable JavaScript 2012
Maintainable JavaScript 2012Nicholas Zakas
 
High Performance JavaScript (CapitolJS 2011)
High Performance JavaScript (CapitolJS 2011)High Performance JavaScript (CapitolJS 2011)
High Performance JavaScript (CapitolJS 2011)Nicholas Zakas
 
Maintainable JavaScript 2011
Maintainable JavaScript 2011Maintainable JavaScript 2011
Maintainable JavaScript 2011Nicholas Zakas
 
High Performance JavaScript 2011
High Performance JavaScript 2011High Performance JavaScript 2011
High Performance JavaScript 2011Nicholas Zakas
 
Mobile Web Speed Bumps
Mobile Web Speed BumpsMobile Web Speed Bumps
Mobile Web Speed BumpsNicholas Zakas
 
High Performance JavaScript (Amazon DevCon 2011)
High Performance JavaScript (Amazon DevCon 2011)High Performance JavaScript (Amazon DevCon 2011)
High Performance JavaScript (Amazon DevCon 2011)Nicholas Zakas
 
Progressive Enhancement 2.0 (Conference Agnostic)
Progressive Enhancement 2.0 (Conference Agnostic)Progressive Enhancement 2.0 (Conference Agnostic)
Progressive Enhancement 2.0 (Conference Agnostic)Nicholas Zakas
 
Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)
Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)
Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)Nicholas Zakas
 
YUI Test The Next Generation (YUIConf 2010)
YUI Test The Next Generation (YUIConf 2010)YUI Test The Next Generation (YUIConf 2010)
YUI Test The Next Generation (YUIConf 2010)Nicholas Zakas
 
Nicholas' Performance Talk at Google
Nicholas' Performance Talk at GoogleNicholas' Performance Talk at Google
Nicholas' Performance Talk at GoogleNicholas Zakas
 
High Performance JavaScript - WebDirections USA 2010
High Performance JavaScript - WebDirections USA 2010High Performance JavaScript - WebDirections USA 2010
High Performance JavaScript - WebDirections USA 2010Nicholas Zakas
 
High Performance JavaScript - jQuery Conference SF Bay Area 2010
High Performance JavaScript - jQuery Conference SF Bay Area 2010High Performance JavaScript - jQuery Conference SF Bay Area 2010
High Performance JavaScript - jQuery Conference SF Bay Area 2010Nicholas Zakas
 
Scalable JavaScript Application Architecture
Scalable JavaScript Application ArchitectureScalable JavaScript Application Architecture
Scalable JavaScript Application ArchitectureNicholas Zakas
 
Extreme JavaScript Compression With YUI Compressor
Extreme JavaScript Compression With YUI CompressorExtreme JavaScript Compression With YUI Compressor
Extreme JavaScript Compression With YUI CompressorNicholas Zakas
 

More from Nicholas Zakas (20)

Browser Wars Episode 1: The Phantom Menace
Browser Wars Episode 1: The Phantom MenaceBrowser Wars Episode 1: The Phantom Menace
Browser Wars Episode 1: The Phantom Menace
 
The Pointerless Web
The Pointerless WebThe Pointerless Web
The Pointerless Web
 
JavaScript APIs you’ve never heard of (and some you have)
JavaScript APIs you’ve never heard of (and some you have)JavaScript APIs you’ve never heard of (and some you have)
JavaScript APIs you’ve never heard of (and some you have)
 
JavaScript Timers, Power Consumption, and Performance
JavaScript Timers, Power Consumption, and PerformanceJavaScript Timers, Power Consumption, and Performance
JavaScript Timers, Power Consumption, and Performance
 
Scalable JavaScript Application Architecture 2012
Scalable JavaScript Application Architecture 2012Scalable JavaScript Application Architecture 2012
Scalable JavaScript Application Architecture 2012
 
Maintainable JavaScript 2012
Maintainable JavaScript 2012Maintainable JavaScript 2012
Maintainable JavaScript 2012
 
High Performance JavaScript (CapitolJS 2011)
High Performance JavaScript (CapitolJS 2011)High Performance JavaScript (CapitolJS 2011)
High Performance JavaScript (CapitolJS 2011)
 
Maintainable JavaScript 2011
Maintainable JavaScript 2011Maintainable JavaScript 2011
Maintainable JavaScript 2011
 
High Performance JavaScript 2011
High Performance JavaScript 2011High Performance JavaScript 2011
High Performance JavaScript 2011
 
Mobile Web Speed Bumps
Mobile Web Speed BumpsMobile Web Speed Bumps
Mobile Web Speed Bumps
 
High Performance JavaScript (Amazon DevCon 2011)
High Performance JavaScript (Amazon DevCon 2011)High Performance JavaScript (Amazon DevCon 2011)
High Performance JavaScript (Amazon DevCon 2011)
 
Progressive Enhancement 2.0 (Conference Agnostic)
Progressive Enhancement 2.0 (Conference Agnostic)Progressive Enhancement 2.0 (Conference Agnostic)
Progressive Enhancement 2.0 (Conference Agnostic)
 
Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)
Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)
Progressive Enhancement 2.0 (jQuery Conference SF Bay Area 2011)
 
YUI Test The Next Generation (YUIConf 2010)
YUI Test The Next Generation (YUIConf 2010)YUI Test The Next Generation (YUIConf 2010)
YUI Test The Next Generation (YUIConf 2010)
 
Nicholas' Performance Talk at Google
Nicholas' Performance Talk at GoogleNicholas' Performance Talk at Google
Nicholas' Performance Talk at Google
 
High Performance JavaScript - WebDirections USA 2010
High Performance JavaScript - WebDirections USA 2010High Performance JavaScript - WebDirections USA 2010
High Performance JavaScript - WebDirections USA 2010
 
High Performance JavaScript - jQuery Conference SF Bay Area 2010
High Performance JavaScript - jQuery Conference SF Bay Area 2010High Performance JavaScript - jQuery Conference SF Bay Area 2010
High Performance JavaScript - jQuery Conference SF Bay Area 2010
 
Responsive interfaces
Responsive interfacesResponsive interfaces
Responsive interfaces
 
Scalable JavaScript Application Architecture
Scalable JavaScript Application ArchitectureScalable JavaScript Application Architecture
Scalable JavaScript Application Architecture
 
Extreme JavaScript Compression With YUI Compressor
Extreme JavaScript Compression With YUI CompressorExtreme JavaScript Compression With YUI Compressor
Extreme JavaScript Compression With YUI Compressor
 

Recently uploaded

AI presentation and introduction - Retrieval Augmented Generation RAG 101
AI presentation and introduction - Retrieval Augmented Generation RAG 101AI presentation and introduction - Retrieval Augmented Generation RAG 101
AI presentation and introduction - Retrieval Augmented Generation RAG 101vincent683379
 
WSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptxWSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptxJennifer Lim
 
A Business-Centric Approach to Design System Strategy
A Business-Centric Approach to Design System StrategyA Business-Centric Approach to Design System Strategy
A Business-Centric Approach to Design System StrategyUXDXConf
 
Structuring Teams and Portfolios for Success
Structuring Teams and Portfolios for SuccessStructuring Teams and Portfolios for Success
Structuring Teams and Portfolios for SuccessUXDXConf
 
Demystifying gRPC in .Net by John Staveley
Demystifying gRPC in .Net by John StaveleyDemystifying gRPC in .Net by John Staveley
Demystifying gRPC in .Net by John StaveleyJohn Staveley
 
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdfHow Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdfFIDO Alliance
 
How we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdfHow we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdfSrushith Repakula
 
The UX of Automation by AJ King, Senior UX Researcher, Ocado
The UX of Automation by AJ King, Senior UX Researcher, OcadoThe UX of Automation by AJ King, Senior UX Researcher, Ocado
The UX of Automation by AJ King, Senior UX Researcher, OcadoUXDXConf
 
Enterprise Knowledge Graphs - Data Summit 2024
Enterprise Knowledge Graphs - Data Summit 2024Enterprise Knowledge Graphs - Data Summit 2024
Enterprise Knowledge Graphs - Data Summit 2024Enterprise Knowledge
 
Google I/O Extended 2024 Warsaw
Google I/O Extended 2024 WarsawGoogle I/O Extended 2024 Warsaw
Google I/O Extended 2024 WarsawGDSC PJATK
 
Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024Patrick Viafore
 
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlFuture Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlPeter Udo Diehl
 
Custom Approval Process: A New Perspective, Pavel Hrbacek & Anindya Halder
Custom Approval Process: A New Perspective, Pavel Hrbacek & Anindya HalderCustom Approval Process: A New Perspective, Pavel Hrbacek & Anindya Halder
Custom Approval Process: A New Perspective, Pavel Hrbacek & Anindya HalderCzechDreamin
 
Where to Learn More About FDO _ Richard at FIDO Alliance.pdf
Where to Learn More About FDO _ Richard at FIDO Alliance.pdfWhere to Learn More About FDO _ Richard at FIDO Alliance.pdf
Where to Learn More About FDO _ Richard at FIDO Alliance.pdfFIDO Alliance
 
Unpacking Value Delivery - Agile Oxford Meetup - May 2024.pptx
Unpacking Value Delivery - Agile Oxford Meetup - May 2024.pptxUnpacking Value Delivery - Agile Oxford Meetup - May 2024.pptx
Unpacking Value Delivery - Agile Oxford Meetup - May 2024.pptxDavid Michel
 
TEST BANK For, Information Technology Project Management 9th Edition Kathy Sc...
TEST BANK For, Information Technology Project Management 9th Edition Kathy Sc...TEST BANK For, Information Technology Project Management 9th Edition Kathy Sc...
TEST BANK For, Information Technology Project Management 9th Edition Kathy Sc...marcuskenyatta275
 
IESVE for Early Stage Design and Planning
IESVE for Early Stage Design and PlanningIESVE for Early Stage Design and Planning
IESVE for Early Stage Design and PlanningIES VE
 
Speed Wins: From Kafka to APIs in Minutes
Speed Wins: From Kafka to APIs in MinutesSpeed Wins: From Kafka to APIs in Minutes
Speed Wins: From Kafka to APIs in Minutesconfluent
 
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...FIDO Alliance
 
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...CzechDreamin
 

Recently uploaded (20)

AI presentation and introduction - Retrieval Augmented Generation RAG 101
AI presentation and introduction - Retrieval Augmented Generation RAG 101AI presentation and introduction - Retrieval Augmented Generation RAG 101
AI presentation and introduction - Retrieval Augmented Generation RAG 101
 
WSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptxWSO2CONMay2024OpenSourceConferenceDebrief.pptx
WSO2CONMay2024OpenSourceConferenceDebrief.pptx
 
A Business-Centric Approach to Design System Strategy
A Business-Centric Approach to Design System StrategyA Business-Centric Approach to Design System Strategy
A Business-Centric Approach to Design System Strategy
 
Structuring Teams and Portfolios for Success
Structuring Teams and Portfolios for SuccessStructuring Teams and Portfolios for Success
Structuring Teams and Portfolios for Success
 
Demystifying gRPC in .Net by John Staveley
Demystifying gRPC in .Net by John StaveleyDemystifying gRPC in .Net by John Staveley
Demystifying gRPC in .Net by John Staveley
 
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdfHow Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
How Red Hat Uses FDO in Device Lifecycle _ Costin and Vitaliy at Red Hat.pdf
 
How we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdfHow we scaled to 80K users by doing nothing!.pdf
How we scaled to 80K users by doing nothing!.pdf
 
The UX of Automation by AJ King, Senior UX Researcher, Ocado
The UX of Automation by AJ King, Senior UX Researcher, OcadoThe UX of Automation by AJ King, Senior UX Researcher, Ocado
The UX of Automation by AJ King, Senior UX Researcher, Ocado
 
Enterprise Knowledge Graphs - Data Summit 2024
Enterprise Knowledge Graphs - Data Summit 2024Enterprise Knowledge Graphs - Data Summit 2024
Enterprise Knowledge Graphs - Data Summit 2024
 
Google I/O Extended 2024 Warsaw
Google I/O Extended 2024 WarsawGoogle I/O Extended 2024 Warsaw
Google I/O Extended 2024 Warsaw
 
Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024Extensible Python: Robustness through Addition - PyCon 2024
Extensible Python: Robustness through Addition - PyCon 2024
 
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo DiehlFuture Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
Future Visions: Predictions to Guide and Time Tech Innovation, Peter Udo Diehl
 
Custom Approval Process: A New Perspective, Pavel Hrbacek & Anindya Halder
Custom Approval Process: A New Perspective, Pavel Hrbacek & Anindya HalderCustom Approval Process: A New Perspective, Pavel Hrbacek & Anindya Halder
Custom Approval Process: A New Perspective, Pavel Hrbacek & Anindya Halder
 
Where to Learn More About FDO _ Richard at FIDO Alliance.pdf
Where to Learn More About FDO _ Richard at FIDO Alliance.pdfWhere to Learn More About FDO _ Richard at FIDO Alliance.pdf
Where to Learn More About FDO _ Richard at FIDO Alliance.pdf
 
Unpacking Value Delivery - Agile Oxford Meetup - May 2024.pptx
Unpacking Value Delivery - Agile Oxford Meetup - May 2024.pptxUnpacking Value Delivery - Agile Oxford Meetup - May 2024.pptx
Unpacking Value Delivery - Agile Oxford Meetup - May 2024.pptx
 
TEST BANK For, Information Technology Project Management 9th Edition Kathy Sc...
TEST BANK For, Information Technology Project Management 9th Edition Kathy Sc...TEST BANK For, Information Technology Project Management 9th Edition Kathy Sc...
TEST BANK For, Information Technology Project Management 9th Edition Kathy Sc...
 
IESVE for Early Stage Design and Planning
IESVE for Early Stage Design and PlanningIESVE for Early Stage Design and Planning
IESVE for Early Stage Design and Planning
 
Speed Wins: From Kafka to APIs in Minutes
Speed Wins: From Kafka to APIs in MinutesSpeed Wins: From Kafka to APIs in Minutes
Speed Wins: From Kafka to APIs in Minutes
 
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
FDO for Camera, Sensor and Networking Device – Commercial Solutions from VinC...
 
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
SOQL 201 for Admins & Developers: Slice & Dice Your Org’s Data With Aggregate...
 

Enough with the JavaScript already!