SlideShare una empresa de Scribd logo
1 de 17
Go With the Reflow Experiments testing browser rendering ,[object Object],[object Object],[object Object],[object Object]
What is Reflow? ,[object Object]
What is Reflow? ,[object Object]
What is Reflow? ,[object Object],[object Object],[object Object]
What is Reflow? ,[object Object],[object Object],[object Object]
What Can Cause a Reflow? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],The box model
What Can Make Reflow Slow? ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Testing ,[object Object],[object Object],[object Object],[object Object],[object Object]
Testing ,[object Object],[object Object]
How Slow? http://code.google.com/events/io/sessions/EvenFasterWebsites.html
Reflow Testing 400 Elements, 1000 CSS Rules (#contents *)‏
Reflow Testing #contents div #contents html #contents a #contents * CSS Specificity Matters!
Reflow Testing 2X Difference in Triton prior to IE8 Webkit is very flat = good
Reflow Testing Is the 4X time for the four sides of the box model in IE6,7?
Reflow Testing More To Come! Divs vs Tables Overflow vs. Inline Block Grids “ CSS is Awesome” Gotchas Having fun yet?!
Speed Up Your Reflows ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Thanks ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Más contenido relacionado

La actualidad más candente

Client Side Optimization
Client Side OptimizationClient Side Optimization
Client Side OptimizationPatrick Huesler
 
Scalability vs. Performance
Scalability vs. PerformanceScalability vs. Performance
Scalability vs. PerformanceSergeyChernyshev
 
AtlasCamp 2014: Static Connect Add-ons
AtlasCamp 2014: Static Connect Add-onsAtlasCamp 2014: Static Connect Add-ons
AtlasCamp 2014: Static Connect Add-onsAtlassian
 
Challenges of angular in production (Tasos Bekos) - GreeceJS #17
Challenges of angular in production (Tasos Bekos) - GreeceJS #17Challenges of angular in production (Tasos Bekos) - GreeceJS #17
Challenges of angular in production (Tasos Bekos) - GreeceJS #17GreeceJS
 
Altitude San Francisco 2018: HTTP Invalidation Workshop
Altitude San Francisco 2018: HTTP Invalidation WorkshopAltitude San Francisco 2018: HTTP Invalidation Workshop
Altitude San Francisco 2018: HTTP Invalidation WorkshopFastly
 
Consuming Web Services in Android
Consuming Web Services in AndroidConsuming Web Services in Android
Consuming Web Services in AndroidDavid Truxall
 
Client side performance analysis
Client side performance analysisClient side performance analysis
Client side performance analysisTsimafei Avilin
 
Concepts on Mean Stack Development
Concepts on Mean Stack DevelopmentConcepts on Mean Stack Development
Concepts on Mean Stack DevelopmentChristopher Sharkey
 
About Caching
About CachingAbout Caching
About CachingWeng Wei
 
Modern Static Site with GatsbyJS
Modern Static Site with GatsbyJSModern Static Site with GatsbyJS
Modern Static Site with GatsbyJSRiza Fahmi
 
The State of Rust Web Frameworks
The State of Rust Web FrameworksThe State of Rust Web Frameworks
The State of Rust Web FrameworksIanWagner10
 
How to Start Performance Testing?
How to Start Performance Testing?How to Start Performance Testing?
How to Start Performance Testing?Nebojša Videnov
 
Intro to Front End Development with Angular + Firebase
Intro to Front End Development with Angular + FirebaseIntro to Front End Development with Angular + Firebase
Intro to Front End Development with Angular + FirebaseBen Drucker
 
Back to the future with static site generators
Back to the future with static site generatorsBack to the future with static site generators
Back to the future with static site generatorsChris Ward
 

La actualidad más candente (20)

web optimizations
web optimizationsweb optimizations
web optimizations
 
Client Side Optimization
Client Side OptimizationClient Side Optimization
Client Side Optimization
 
Scalability vs. Performance
Scalability vs. PerformanceScalability vs. Performance
Scalability vs. Performance
 
Metarefresh
MetarefreshMetarefresh
Metarefresh
 
AtlasCamp 2014: Static Connect Add-ons
AtlasCamp 2014: Static Connect Add-onsAtlasCamp 2014: Static Connect Add-ons
AtlasCamp 2014: Static Connect Add-ons
 
Meta Refresh 2014
Meta Refresh 2014Meta Refresh 2014
Meta Refresh 2014
 
Challenges of angular in production (Tasos Bekos) - GreeceJS #17
Challenges of angular in production (Tasos Bekos) - GreeceJS #17Challenges of angular in production (Tasos Bekos) - GreeceJS #17
Challenges of angular in production (Tasos Bekos) - GreeceJS #17
 
Altitude San Francisco 2018: HTTP Invalidation Workshop
Altitude San Francisco 2018: HTTP Invalidation WorkshopAltitude San Francisco 2018: HTTP Invalidation Workshop
Altitude San Francisco 2018: HTTP Invalidation Workshop
 
Gatsby intro
Gatsby introGatsby intro
Gatsby intro
 
A faster web
A faster webA faster web
A faster web
 
Consuming Web Services in Android
Consuming Web Services in AndroidConsuming Web Services in Android
Consuming Web Services in Android
 
Client side performance analysis
Client side performance analysisClient side performance analysis
Client side performance analysis
 
Concepts on Mean Stack Development
Concepts on Mean Stack DevelopmentConcepts on Mean Stack Development
Concepts on Mean Stack Development
 
About Caching
About CachingAbout Caching
About Caching
 
Jayway Web Tech Radar 2015
Jayway Web Tech Radar 2015Jayway Web Tech Radar 2015
Jayway Web Tech Radar 2015
 
Modern Static Site with GatsbyJS
Modern Static Site with GatsbyJSModern Static Site with GatsbyJS
Modern Static Site with GatsbyJS
 
The State of Rust Web Frameworks
The State of Rust Web FrameworksThe State of Rust Web Frameworks
The State of Rust Web Frameworks
 
How to Start Performance Testing?
How to Start Performance Testing?How to Start Performance Testing?
How to Start Performance Testing?
 
Intro to Front End Development with Angular + Firebase
Intro to Front End Development with Angular + FirebaseIntro to Front End Development with Angular + Firebase
Intro to Front End Development with Angular + Firebase
 
Back to the future with static site generators
Back to the future with static site generatorsBack to the future with static site generators
Back to the future with static site generators
 

Similar a Go With The Reflow

Front-end optimisation & jQuery Internals
Front-end optimisation & jQuery InternalsFront-end optimisation & jQuery Internals
Front-end optimisation & jQuery InternalsArtur Cistov
 
Front-end optimisation & jQuery Internals (Pycon)
Front-end optimisation & jQuery Internals (Pycon)Front-end optimisation & jQuery Internals (Pycon)
Front-end optimisation & jQuery Internals (Pycon)Artur Cistov
 
JavaScript front end performance optimizations
JavaScript front end performance optimizationsJavaScript front end performance optimizations
JavaScript front end performance optimizationsChris Love
 
Rencore Webinar: Developing Secure and Performant JavaScript for SharePoint
Rencore Webinar: Developing Secure and Performant JavaScript for SharePointRencore Webinar: Developing Secure and Performant JavaScript for SharePoint
Rencore Webinar: Developing Secure and Performant JavaScript for SharePointRencore
 
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5Sadaaki HIRAI
 
Web Performance 101 - Gil Givati
Web Performance 101 - Gil GivatiWeb Performance 101 - Gil Givati
Web Performance 101 - Gil GivatiMika Josting
 
Technology Trends
Technology TrendsTechnology Trends
Technology TrendsHenry Jacob
 
ZZ BC#7.5 asp.net mvc practice and guideline refresh!
ZZ BC#7.5 asp.net mvc practice  and guideline refresh! ZZ BC#7.5 asp.net mvc practice  and guideline refresh!
ZZ BC#7.5 asp.net mvc practice and guideline refresh! Chalermpon Areepong
 
Web Development for UX Designers
Web Development for UX DesignersWeb Development for UX Designers
Web Development for UX DesignersAshlimarie
 
Practicing at the Cutting Edge: Learning and Unlearning about Java Performance
Practicing at the Cutting Edge: Learning and Unlearning about Java PerformancePracticing at the Cutting Edge: Learning and Unlearning about Java Performance
Practicing at the Cutting Edge: Learning and Unlearning about Java PerformanceC4Media
 
Web Apps and more
Web Apps and moreWeb Apps and more
Web Apps and moreYan Shi
 
Web app and more
Web app and moreWeb app and more
Web app and morefaming su
 
SXSW 2012 JavaScript MythBusters
SXSW 2012 JavaScript MythBustersSXSW 2012 JavaScript MythBusters
SXSW 2012 JavaScript MythBustersElena-Oana Tabaranu
 
Get Ahead with HTML5 on Moible
Get Ahead with HTML5 on MoibleGet Ahead with HTML5 on Moible
Get Ahead with HTML5 on Moiblemarkuskobler
 
Developing a Struts & Tiles application using WebSphere Studio
Developing a Struts & Tiles application using WebSphere StudioDeveloping a Struts & Tiles application using WebSphere Studio
Developing a Struts & Tiles application using WebSphere Studioelliando dias
 
It is not HTML5. but ... / HTML5ではないサイトからHTML5を考える
It is not HTML5. but ... / HTML5ではないサイトからHTML5を考えるIt is not HTML5. but ... / HTML5ではないサイトからHTML5を考える
It is not HTML5. but ... / HTML5ではないサイトからHTML5を考えるSadaaki HIRAI
 
Open-source website performance tools
Open-source website performance toolsOpen-source website performance tools
Open-source website performance toolsArtur Cistov
 

Similar a Go With The Reflow (20)

Front-end optimisation & jQuery Internals
Front-end optimisation & jQuery InternalsFront-end optimisation & jQuery Internals
Front-end optimisation & jQuery Internals
 
Front-end optimisation & jQuery Internals (Pycon)
Front-end optimisation & jQuery Internals (Pycon)Front-end optimisation & jQuery Internals (Pycon)
Front-end optimisation & jQuery Internals (Pycon)
 
JavaScript front end performance optimizations
JavaScript front end performance optimizationsJavaScript front end performance optimizations
JavaScript front end performance optimizations
 
Rencore Webinar: Developing Secure and Performant JavaScript for SharePoint
Rencore Webinar: Developing Secure and Performant JavaScript for SharePointRencore Webinar: Developing Secure and Performant JavaScript for SharePoint
Rencore Webinar: Developing Secure and Performant JavaScript for SharePoint
 
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
Familiar HTML5 - 事例とサンプルコードから学ぶ 身近で普通に使わているHTML5
 
Sexy React Stack
Sexy React StackSexy React Stack
Sexy React Stack
 
Web Performance 101 - Gil Givati
Web Performance 101 - Gil GivatiWeb Performance 101 - Gil Givati
Web Performance 101 - Gil Givati
 
Technology Trends
Technology TrendsTechnology Trends
Technology Trends
 
ZZ BC#7.5 asp.net mvc practice and guideline refresh!
ZZ BC#7.5 asp.net mvc practice  and guideline refresh! ZZ BC#7.5 asp.net mvc practice  and guideline refresh!
ZZ BC#7.5 asp.net mvc practice and guideline refresh!
 
Coding the UI
Coding the UICoding the UI
Coding the UI
 
Coding Ui
Coding UiCoding Ui
Coding Ui
 
Web Development for UX Designers
Web Development for UX DesignersWeb Development for UX Designers
Web Development for UX Designers
 
Practicing at the Cutting Edge: Learning and Unlearning about Java Performance
Practicing at the Cutting Edge: Learning and Unlearning about Java PerformancePracticing at the Cutting Edge: Learning and Unlearning about Java Performance
Practicing at the Cutting Edge: Learning and Unlearning about Java Performance
 
Web Apps and more
Web Apps and moreWeb Apps and more
Web Apps and more
 
Web app and more
Web app and moreWeb app and more
Web app and more
 
SXSW 2012 JavaScript MythBusters
SXSW 2012 JavaScript MythBustersSXSW 2012 JavaScript MythBusters
SXSW 2012 JavaScript MythBusters
 
Get Ahead with HTML5 on Moible
Get Ahead with HTML5 on MoibleGet Ahead with HTML5 on Moible
Get Ahead with HTML5 on Moible
 
Developing a Struts & Tiles application using WebSphere Studio
Developing a Struts & Tiles application using WebSphere StudioDeveloping a Struts & Tiles application using WebSphere Studio
Developing a Struts & Tiles application using WebSphere Studio
 
It is not HTML5. but ... / HTML5ではないサイトからHTML5を考える
It is not HTML5. but ... / HTML5ではないサイトからHTML5を考えるIt is not HTML5. but ... / HTML5ではないサイトからHTML5を考える
It is not HTML5. but ... / HTML5ではないサイトからHTML5を考える
 
Open-source website performance tools
Open-source website performance toolsOpen-source website performance tools
Open-source website performance tools
 

Último

Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfRankYa
 
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DayH2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DaySri Ambati
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .Alan Dix
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupFlorian Wilhelm
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfPrecisely
 
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningDSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningLars Bell
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyAlfredo García Lavilla
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenHervé Boutemy
 
Artificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxArtificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxhariprasad279825
 
Powerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time ClashPowerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time Clashcharlottematthew16
 
Story boards and shot lists for my a level piece
Story boards and shot lists for my a level pieceStory boards and shot lists for my a level piece
Story boards and shot lists for my a level piececharlottematthew16
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsPixlogix Infotech
 
Dev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebDev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebUiPathCommunity
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostZilliz
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfAddepto
 
Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!Manik S Magar
 
How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.Curtis Poe
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsMiki Katsuragi
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionDilum Bandara
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):comworks
 

Último (20)

Search Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdfSearch Engine Optimization SEO PDF for 2024.pdf
Search Engine Optimization SEO PDF for 2024.pdf
 
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo DayH2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
H2O.ai CEO/Founder: Sri Ambati Keynote at Wells Fargo Day
 
From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .From Family Reminiscence to Scholarly Archive .
From Family Reminiscence to Scholarly Archive .
 
Streamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project SetupStreamlining Python Development: A Guide to a Modern Project Setup
Streamlining Python Development: A Guide to a Modern Project Setup
 
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdfHyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
Hyperautomation and AI/ML: A Strategy for Digital Transformation Success.pdf
 
DSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine TuningDSPy a system for AI to Write Prompts and Do Fine Tuning
DSPy a system for AI to Write Prompts and Do Fine Tuning
 
Commit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easyCommit 2024 - Secret Management made easy
Commit 2024 - Secret Management made easy
 
DevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache MavenDevoxxFR 2024 Reproducible Builds with Apache Maven
DevoxxFR 2024 Reproducible Builds with Apache Maven
 
Artificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptxArtificial intelligence in cctv survelliance.pptx
Artificial intelligence in cctv survelliance.pptx
 
Powerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time ClashPowerpoint exploring the locations used in television show Time Clash
Powerpoint exploring the locations used in television show Time Clash
 
Story boards and shot lists for my a level piece
Story boards and shot lists for my a level pieceStory boards and shot lists for my a level piece
Story boards and shot lists for my a level piece
 
The Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and ConsThe Ultimate Guide to Choosing WordPress Pros and Cons
The Ultimate Guide to Choosing WordPress Pros and Cons
 
Dev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio WebDev Dives: Streamline document processing with UiPath Studio Web
Dev Dives: Streamline document processing with UiPath Studio Web
 
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage CostLeverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
Leverage Zilliz Serverless - Up to 50X Saving for Your Vector Storage Cost
 
Gen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdfGen AI in Business - Global Trends Report 2024.pdf
Gen AI in Business - Global Trends Report 2024.pdf
 
Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!Anypoint Exchange: It’s Not Just a Repo!
Anypoint Exchange: It’s Not Just a Repo!
 
How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.How AI, OpenAI, and ChatGPT impact business and software.
How AI, OpenAI, and ChatGPT impact business and software.
 
Vertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering TipsVertex AI Gemini Prompt Engineering Tips
Vertex AI Gemini Prompt Engineering Tips
 
Advanced Computer Architecture – An Introduction
Advanced Computer Architecture – An IntroductionAdvanced Computer Architecture – An Introduction
Advanced Computer Architecture – An Introduction
 
CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):CloudStudio User manual (basic edition):
CloudStudio User manual (basic edition):
 

Go With The Reflow