SlideShare a Scribd company logo
CHROME INTERNALS:
PAINT AND COMPOSITION
by Dzmitry Varabei
Demo
Page Rendering Cycle
• Parse HTML and CSS files
• Build the DOM
Nodes and the DOM tree
<html>
<body>
<div>
Hello
</div>
</body>
</html>
HTMLDocument
HTMLHTMLElement
HTMLBodyElement
HTMLDivElement
Text("Hello")

Recommended for you

WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolution
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 RevolutionWebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolution
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolution

This document summarizes Juan J. Sánchez's presentation on WebKit and Blink. It discusses: 1) The history and goals of the WebKit project from 2004-2013, including its features, architecture, ports, and licenses. 2) The WebKit community, including types of contributors, tools used, and events held. 3) The creation of Blink in 2013 when Google forked WebKit, the motivations behind it, and its impact on the WebKit community. 4) The current status of WebKit and Blink projects and their future perspectives.

blinkchromiumlinuxcon
WebKit and Blink: open development powering the HTML5 revolution
WebKit and Blink: open development powering the HTML5 revolutionWebKit and Blink: open development powering the HTML5 revolution
WebKit and Blink: open development powering the HTML5 revolution

This document provides an overview of the WebKit technology, community, and ongoing work. It discusses WebKit's goals, features, architecture, ports, and the WebKit2 API. It also covers the Blink fork, the WebKit community and contributing process, and provides statistics on codebase size and contributors.

webkit blink javascriptcore v8 web linux opensourc
How Browser Works?
How Browser Works?How Browser Works?
How Browser Works?

The document provides an overview of how a browser works by breaking it down into key components and subcomponents. It discusses the user interface, browser engine, rendering engine, networking, JavaScript interpreter, UI backend, data persistence, and web APIs that make up a browser. It then dives deeper into specific subcomponents like the HTML parser, CSS parser, DOM, rendering tree, layout and reflow process, and event loop. The document uses diagrams and examples to illustrate how each component interacts and the main flows and processes involved in rendering web content in the browser.

browserkharkivjssoftware development
Page Rendering Cycle
• Parse HTML and CSS files
• Build the DOM
• Calculate CSS property values
• Build the rendering tree
RenderObject Tree
This is a data structure that helps the
browser perform layout tasks.
display:none
<head>
<script>
<style>
anonymous line box
:before
Page Rendering Cycle
• Parse HTML and CSS files
• Build the DOM
• Calculate CSS property values
• Build the rendering tree
• Calculate layout
• Paint
• Composite
• Draw the final screen image onto the screen
Display refresh rate
~ 60Hz
or
~16.6ms to make a frame

Recommended for you

Chromium vs. Firefox
Chromium vs. FirefoxChromium vs. Firefox
Chromium vs. Firefox

The document compares the architectures and features of the Firefox and Chromium web browsers. It outlines their reference architectures, functional requirements like user interfaces, media playback, and downloads management. It also discusses their non-functional requirements including security, performance, and extensibility. Finally, it provides a high-level comparison of their architectures and a deeper look at differences in their security models.

mozilla firefoxchromiumopen source
Web browser architecture
Web browser architectureWeb browser architecture
Web browser architecture

The document discusses the main components of a web browser, including the user interface, browser engine, rendering engine, networking, JavaScript interpreter, UI backend, and data storage. It provides details on how different browsers use different rendering engines, such as Gecko, WebKit, Blink, and Trident. The rendering engine is responsible for parsing HTML and CSS to construct the DOM and render tree before layout, painting and displaying the web page.

safarijavascriptcorev8 engine
Architecture of the Web browser
Architecture of the Web browserArchitecture of the Web browser
Architecture of the Web browser

A presentation depicting the most important aspects regarding the internal architecture of a Web browser.

engineeringclientdevelopment
console> chrome.exe
--enable-threaded-compositing
--force-compositing-mode
--enable-impl-side-painting
--enable-skia-benchmarking
--allow-webui-compositing
Google Chrome Canary
Trace Event Profiling Tool
about://tracing/
Read more:
http://dev.chromium.org/developers/how-
tos/trace-event-profiling-tool
Demo – CSS Paint Order
Paint
The phase of rendering where
RenderObjects make calls into the
GraphicsContext API to make a visual
representation of themselves

Recommended for you

Korea linuxforum2014 html5game-sangseoklim
Korea linuxforum2014 html5game-sangseoklimKorea linuxforum2014 html5game-sangseoklim
Korea linuxforum2014 html5game-sangseoklim

This document discusses techniques for optimizing the performance of HTML5 games on mobile devices. It begins with an overview of HTML5 game architecture and the WebKit rendering process. It then analyzes sources of performance issues, such as painting size and DOM complexity. The document recommends several optimization techniques, including DOM/canvas hybrid rendering, static object pooling, smart repainting of invalidated areas only, and minimizing source image scaling. Case studies demonstrating these techniques for real games are also presented.

canvasdommobile device
Html5
Html5Html5
Html5

HTML5 introduces several new features including new semantic elements, support for embedded video and audio, canvas element for 2D/3D graphics, offline web applications, and drag and drop. It also removes some older HTML elements. HTML5 is still a work in progress but is supported by all major browsers. It aims to make web pages more compatible with new technologies and reduce the need for browser plug-ins.

html5 new elements
Components now!
Components now! Components now!
Components now!

1) The document discusses libraries versus components in web development. Libraries are described as large, tightly coupled, and difficult to understand, while components are proposed as a simpler alternative being lightweight, standalone, and isolated. 2) It provides an example of building a simple "my-share" component using modern web standards and design principles like CommonJS modules, BEM methodology, and external dependency management. 3) The conclusion advocates for writing and using more standalone components instead of libraries to take advantage of the increased capabilities now available in the web platform.

Skia Graphics Engine
Skia is the open source C++ graphics
library for drawing Text,
Geometries, and Images.
https://code.google.com/p/skia/
Skia is currently used in
Google
Chrome
Mozilla
Firefox
Chrome
OS
Android Sublime
Text 3
Skia Debugger - Demo
How to save .skp files from Chromium?
http://www.chromium.org/developers/h
ow-tos/trace-event-profiling-tool/saving-
skp-s-from-chromium

Recommended for you

Hw accelerated webkitgtk+ on raspberry pi
Hw accelerated webkitgtk+ on raspberry piHw accelerated webkitgtk+ on raspberry pi
Hw accelerated webkitgtk+ on raspberry pi

This is some kind of report for implementation and experimentation about "Hardware Accelerated WebKitGTK+ for the embedded device" which is running on the Raspberry Pi device in real. Authored by Changseok Oh, who is working in the Collabora from 2013.

gnomewebkitgtk+
Web Components the best marriage for a PWA
Web Components the best marriage for a PWAWeb Components the best marriage for a PWA
Web Components the best marriage for a PWA

Location: Progressive Web App Dev Summit, GDG Madrid 21-Jul-2016 Abstract: Progressive Web Apps (PWA) have responsive layout, works offline, and can be on the home screen. WebComponents allows build all those missing HTML pieces. Polymer is a library for manipulating Web Components. This presentation joins all those new technologies for creating the Future Apps.

pwa polymer web-components vaadin gdg
[D2 오픈세미나]2.browser engine 이형욱_20140523
[D2 오픈세미나]2.browser engine 이형욱_20140523[D2 오픈세미나]2.browser engine 이형욱_20140523
[D2 오픈세미나]2.browser engine 이형욱_20140523

This document discusses how web browsers work and techniques for improving rendering performance. It covers how browsers parse HTML and CSS to build a render tree. The render tree is then laid out and painted to the screen. It also describes different rendering paths including software rendering, hardware accelerated rendering using the GPU, and techniques like layering and compositing. Guidelines are provided for optimizing CSS animations and using developer tools to analyze rendering performance.

What cause complex painting?
• image decodes/resizes
• box-shadow (essentially
improved over
the past 2 years)
• border-radius
• border-radius + box-shadow
Read more: CSS Paint Times and Page Render Weight
Software mode VS Accelerated
compositing mode
Composition
Accelerated compositing mode
Layer bitmaps are transferred to the
GPU, combined ("composited"), and
drawn on the screen.

Recommended for you

Browsers. Magic is inside.
Browsers. Magic is inside.Browsers. Magic is inside.
Browsers. Magic is inside.

Browser internal components Main processes during page load or dynamic changes Performance tips and tricks Chrome Devtools in action

devexpertssoftware developmentweb development
Polymer / WebComponents
Polymer / WebComponentsPolymer / WebComponents
Polymer / WebComponents

- Nuxeo has historically used different technologies for its UI such as ZPT, JSF, and AngularJS but is now exploring using Web Components with frameworks like Polymer and React. - Polymer helps build custom elements and adds sugar to remove boilerplate from element registration, lifecycle callbacks, and observers. Nuxeo elements could provide reusable UI building blocks. - The new Nuxeo Web UI would use the DOM as the framework and include Nuxeo elements for data and UI, layouts for convention-based dynamic loading, and testing with WCT and nuxeo-ftest.

webcomponentsmeetupnuxeo
Building Real-World Dojo Web Applications
Building Real-World Dojo Web ApplicationsBuilding Real-World Dojo Web Applications
Building Real-World Dojo Web Applications

This document discusses building real-world web applications with Dojo. It provides an overview of how web applications have evolved from static Web 1.0 models to more dynamic Web 2.0 models using AJAX, REST, and JSON. It introduces Dojo as a JavaScript library for building rich web applications and discusses Dojo concepts like widgets, modules, and best practices for designing, developing, and testing Dojo applications.

dojo web20
Layer
Layer: section of the page, subtree of the
DOM. Painted independently,
composited on the GPU, and can
stretch, move, and fade without
repainting.
Which elements have their own layer?
• Root page object
• Canvas
• Video element
• plugins (flash and etc)
• Elements with CSS properties: TranslateZ,
Translate3d, Opacity, ScaleZ, RotateZ...
• 2D Transforms do not create layer
The cost of too many layers:
Additional GPU and memory usage
Render profiling tools
• Show FPS
• Show paint rectangles
• Continuous page repainting
• Show composited layer borders
• Timeline -> Frames

Recommended for you

HTML5와 오픈소스 기반의 Web Components 기술
HTML5와 오픈소스 기반의 Web Components 기술HTML5와 오픈소스 기반의 Web Components 기술
HTML5와 오픈소스 기반의 Web Components 기술

HTML5 의 표준 권고안이 채택되면서 HTML5는 엄청난 속도로 웹 전반에 걸쳐 보급되고 있습니다. HTML5 와 기존의 HTML4 / XHTML 1.1 과의 가장 큰 차잇점은 웹을 바라보는 관점입니다. 웹브라우저를 저작 플랫폼이 아닌 실행 환경으로 바라보는 HTML5의 독특한 관점은 webcomponent 에 잘 드러나 있습니다. 이 발표에서는 webcomponent 의 개념 및 역사를 훑고, webcomponent 오픈소스 구현체들인 webcomponents.js 및 구글의 Polymer, 모질라의 x-tag 과 함께 페이스북의 React 와의 비교 및 브라우저 대응에 대한 내용을 다룹니다.

web componentshtml5react
Firefox Architecture Overview
Firefox Architecture OverviewFirefox Architecture Overview
Firefox Architecture Overview

An overview of the technical architecture of Firefox and a glimpse into extending the browser's functionality.

architectureadd-onsfirefox
Paints
PaintsPaints
Paints

The document discusses different types of paints used for interior and exterior surfaces. It describes the key ingredients in paint like pigments, binders, liquids, and additives. It also outlines different types of surface finishes like white wash, color wash, distemper, cement paint etc. The preparation of surfaces prior to painting and application methods for different paint types are explained. Water based and oil based paints are compared in terms of their advantages.

paintsmanitspecifications of paints
Questions?
Resources
• How Browsers Work
• http://jankfree.org/
• Jank Free: Chrome Rendering Performance
• Compositing in Blink and WebKit
• Trace Event Profiling Tool (about:tracing)
• GPU Accelerated Compositing in Chrome
• CSS Paint Times and Page Render Weight
• http://dev.chromium.org/developers/tech
-talk-videos
Thanks!
Dzmitry.Varabei@gmail.com

More Related Content

What's hot

Android Chromium Rendering Pipeline
Android Chromium Rendering PipelineAndroid Chromium Rendering Pipeline
Android Chromium Rendering Pipeline
Hyungwook Lee
 
Web Standards Support in WebKit
Web Standards Support in WebKitWeb Standards Support in WebKit
Web Standards Support in WebKit
Joone Hur
 
Introduction to Browser Internals
Introduction to Browser InternalsIntroduction to Browser Internals
Introduction to Browser Internals
Siva Arunachalam
 
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolution
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 RevolutionWebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolution
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolution
juanjosanchezpenas
 
WebKit and Blink: open development powering the HTML5 revolution
WebKit and Blink: open development powering the HTML5 revolutionWebKit and Blink: open development powering the HTML5 revolution
WebKit and Blink: open development powering the HTML5 revolution
juanjosanchezpenas
 
How Browser Works?
How Browser Works?How Browser Works?
How Browser Works?
Vova Voyevidka
 
Chromium vs. Firefox
Chromium vs. FirefoxChromium vs. Firefox
Chromium vs. Firefox
Rashmika Nawaratne
 
Web browser architecture
Web browser architectureWeb browser architecture
Web browser architecture
Nguyen Quang
 
Architecture of the Web browser
Architecture of the Web browserArchitecture of the Web browser
Architecture of the Web browser
Sabin Buraga
 
Korea linuxforum2014 html5game-sangseoklim
Korea linuxforum2014 html5game-sangseoklimKorea linuxforum2014 html5game-sangseoklim
Korea linuxforum2014 html5game-sangseoklim
Sang Seok Lim
 
Html5
Html5Html5
Html5
mikusuraj
 
Components now!
Components now! Components now!
Components now!
Mikhail Davydov
 
Hw accelerated webkitgtk+ on raspberry pi
Hw accelerated webkitgtk+ on raspberry piHw accelerated webkitgtk+ on raspberry pi
Hw accelerated webkitgtk+ on raspberry pi
gnomekr
 
Web Components the best marriage for a PWA
Web Components the best marriage for a PWAWeb Components the best marriage for a PWA
Web Components the best marriage for a PWA
Manuel Carrasco Moñino
 
[D2 오픈세미나]2.browser engine 이형욱_20140523
[D2 오픈세미나]2.browser engine 이형욱_20140523[D2 오픈세미나]2.browser engine 이형욱_20140523
[D2 오픈세미나]2.browser engine 이형욱_20140523
NAVER D2
 
Browsers. Magic is inside.
Browsers. Magic is inside.Browsers. Magic is inside.
Browsers. Magic is inside.
Devexperts
 
Polymer / WebComponents
Polymer / WebComponentsPolymer / WebComponents
Polymer / WebComponents
Arnaud Kervern
 
Building Real-World Dojo Web Applications
Building Real-World Dojo Web ApplicationsBuilding Real-World Dojo Web Applications
Building Real-World Dojo Web Applications
Andrew Ferrier
 
HTML5와 오픈소스 기반의 Web Components 기술
HTML5와 오픈소스 기반의 Web Components 기술HTML5와 오픈소스 기반의 Web Components 기술
HTML5와 오픈소스 기반의 Web Components 기술
Jeongkyu Shin
 
Firefox Architecture Overview
Firefox Architecture OverviewFirefox Architecture Overview
Firefox Architecture Overview
Anant Narayanan
 

What's hot (20)

Android Chromium Rendering Pipeline
Android Chromium Rendering PipelineAndroid Chromium Rendering Pipeline
Android Chromium Rendering Pipeline
 
Web Standards Support in WebKit
Web Standards Support in WebKitWeb Standards Support in WebKit
Web Standards Support in WebKit
 
Introduction to Browser Internals
Introduction to Browser InternalsIntroduction to Browser Internals
Introduction to Browser Internals
 
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolution
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 RevolutionWebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolution
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolution
 
WebKit and Blink: open development powering the HTML5 revolution
WebKit and Blink: open development powering the HTML5 revolutionWebKit and Blink: open development powering the HTML5 revolution
WebKit and Blink: open development powering the HTML5 revolution
 
How Browser Works?
How Browser Works?How Browser Works?
How Browser Works?
 
Chromium vs. Firefox
Chromium vs. FirefoxChromium vs. Firefox
Chromium vs. Firefox
 
Web browser architecture
Web browser architectureWeb browser architecture
Web browser architecture
 
Architecture of the Web browser
Architecture of the Web browserArchitecture of the Web browser
Architecture of the Web browser
 
Korea linuxforum2014 html5game-sangseoklim
Korea linuxforum2014 html5game-sangseoklimKorea linuxforum2014 html5game-sangseoklim
Korea linuxforum2014 html5game-sangseoklim
 
Html5
Html5Html5
Html5
 
Components now!
Components now! Components now!
Components now!
 
Hw accelerated webkitgtk+ on raspberry pi
Hw accelerated webkitgtk+ on raspberry piHw accelerated webkitgtk+ on raspberry pi
Hw accelerated webkitgtk+ on raspberry pi
 
Web Components the best marriage for a PWA
Web Components the best marriage for a PWAWeb Components the best marriage for a PWA
Web Components the best marriage for a PWA
 
[D2 오픈세미나]2.browser engine 이형욱_20140523
[D2 오픈세미나]2.browser engine 이형욱_20140523[D2 오픈세미나]2.browser engine 이형욱_20140523
[D2 오픈세미나]2.browser engine 이형욱_20140523
 
Browsers. Magic is inside.
Browsers. Magic is inside.Browsers. Magic is inside.
Browsers. Magic is inside.
 
Polymer / WebComponents
Polymer / WebComponentsPolymer / WebComponents
Polymer / WebComponents
 
Building Real-World Dojo Web Applications
Building Real-World Dojo Web ApplicationsBuilding Real-World Dojo Web Applications
Building Real-World Dojo Web Applications
 
HTML5와 오픈소스 기반의 Web Components 기술
HTML5와 오픈소스 기반의 Web Components 기술HTML5와 오픈소스 기반의 Web Components 기술
HTML5와 오픈소스 기반의 Web Components 기술
 
Firefox Architecture Overview
Firefox Architecture OverviewFirefox Architecture Overview
Firefox Architecture Overview
 

Viewers also liked

Paints
PaintsPaints
Different types of Paint and Finishes
Different types of Paint and FinishesDifferent types of Paint and Finishes
Different types of Paint and Finishes
paintlover
 
Le corbusier - A Brief
Le corbusier - A BriefLe corbusier - A Brief
Le corbusier - A Brief
Hananeel Sandhi
 
Paints And its types
Paints And its typesPaints And its types
Paints And its types
Harpreet Oberoi
 
le corbusier principles
le corbusier principlesle corbusier principles
le corbusier principles
kunal singh
 
Le Corbusier
Le CorbusierLe Corbusier
Le Corbusier
Rakesh Samaddar
 
PRESENTATION ON PAINT
PRESENTATION ON PAINTPRESENTATION ON PAINT
PRESENTATION ON PAINT
Rohit Khurana
 

Viewers also liked (7)

Paints
PaintsPaints
Paints
 
Different types of Paint and Finishes
Different types of Paint and FinishesDifferent types of Paint and Finishes
Different types of Paint and Finishes
 
Le corbusier - A Brief
Le corbusier - A BriefLe corbusier - A Brief
Le corbusier - A Brief
 
Paints And its types
Paints And its typesPaints And its types
Paints And its types
 
le corbusier principles
le corbusier principlesle corbusier principles
le corbusier principles
 
Le Corbusier
Le CorbusierLe Corbusier
Le Corbusier
 
PRESENTATION ON PAINT
PRESENTATION ON PAINTPRESENTATION ON PAINT
PRESENTATION ON PAINT
 

Similar to Chrome Internals: Paint and Composition

How Browsers Work
How Browsers Work How Browsers Work
How Browsers Work
myposter GmbH
 
Vlad zelinschi optimizing the critical rendering path
Vlad zelinschi   optimizing the critical rendering pathVlad zelinschi   optimizing the critical rendering path
Vlad zelinschi optimizing the critical rendering path
Codecamp Romania
 
Exploring Critical Rendering Path
Exploring Critical Rendering PathExploring Critical Rendering Path
Exploring Critical Rendering Path
Raphael Amorim
 
Ustream Techtalks: Google Chrome Developer Tools
Ustream Techtalks: Google Chrome Developer ToolsUstream Techtalks: Google Chrome Developer Tools
Ustream Techtalks: Google Chrome Developer Tools
Máté Nádasdi
 
Dev tools rendering & memory profiling
Dev tools rendering & memory profilingDev tools rendering & memory profiling
Dev tools rendering & memory profiling
Open Academy
 
Google Chrome DevTools: Rendering & Memory profiling on Open Academy 2013
Google Chrome DevTools: Rendering & Memory profiling on Open Academy 2013Google Chrome DevTools: Rendering & Memory profiling on Open Academy 2013
Google Chrome DevTools: Rendering & Memory profiling on Open Academy 2013
Máté Nádasdi
 
Hardware accelerated rendering in WebKit for android
Hardware accelerated rendering in WebKit for androidHardware accelerated rendering in WebKit for android
Hardware accelerated rendering in WebKit for android
Tankery Chen
 
Html5 more than just html5 v final
Html5  more than just html5 v finalHtml5  more than just html5 v final
Html5 more than just html5 v final
Lohith Goudagere Nagaraj
 
Building high performing web pages
Building high performing web pagesBuilding high performing web pages
Building high performing web pages
Nilesh Bafna
 
DYNAMIC HYPERTEXT MARKUP LANGUAGE (DHTML) & CSS WITH Application of JavaScript
DYNAMIC HYPERTEXT MARKUP LANGUAGE (DHTML) & CSS WITH Application of JavaScriptDYNAMIC HYPERTEXT MARKUP LANGUAGE (DHTML) & CSS WITH Application of JavaScript
DYNAMIC HYPERTEXT MARKUP LANGUAGE (DHTML) & CSS WITH Application of JavaScript
Soumen Santra
 
web development
web developmentweb development
web development
RamanDeep876641
 
Please dont touch-3.5
Please dont touch-3.5Please dont touch-3.5
Please dont touch-3.5
Francesco Fullone
 
#Webperf Choreography
#Webperf Choreography#Webperf Choreography
#Webperf Choreography
Harald Kirschner
 
Incremental DOM and Recent Trend of Frontend Development
Incremental DOM and Recent Trend of Frontend DevelopmentIncremental DOM and Recent Trend of Frontend Development
Incremental DOM and Recent Trend of Frontend Development
Akihiro Ikezoe
 
Responsive Web Design: Clever Tips and Techniques
Responsive Web Design: Clever Tips and TechniquesResponsive Web Design: Clever Tips and Techniques
Responsive Web Design: Clever Tips and Techniques
Vitaly Friedman
 
Please Don't Touch the Slow Parts V3
Please Don't Touch the Slow Parts V3Please Don't Touch the Slow Parts V3
Please Don't Touch the Slow Parts V3
Federico Galassi
 
Trendsetting: Web Design and Beyond
Trendsetting: Web Design and BeyondTrendsetting: Web Design and Beyond
Trendsetting: Web Design and Beyond
Andy Stratton
 
WEB DEVELOPMENT.pptx
WEB DEVELOPMENT.pptxWEB DEVELOPMENT.pptx
WEB DEVELOPMENT.pptx
silvers5
 
Masterin Large Scale Java Script Applications
Masterin Large Scale Java Script ApplicationsMasterin Large Scale Java Script Applications
Masterin Large Scale Java Script Applications
Fabian Jakobs
 
"Responsive Web Design: Clever Tips and Techniques". Vitaly Friedman, Smashin...
"Responsive Web Design: Clever Tips and Techniques". Vitaly Friedman, Smashin..."Responsive Web Design: Clever Tips and Techniques". Vitaly Friedman, Smashin...
"Responsive Web Design: Clever Tips and Techniques". Vitaly Friedman, Smashin...
Yandex
 

Similar to Chrome Internals: Paint and Composition (20)

How Browsers Work
How Browsers Work How Browsers Work
How Browsers Work
 
Vlad zelinschi optimizing the critical rendering path
Vlad zelinschi   optimizing the critical rendering pathVlad zelinschi   optimizing the critical rendering path
Vlad zelinschi optimizing the critical rendering path
 
Exploring Critical Rendering Path
Exploring Critical Rendering PathExploring Critical Rendering Path
Exploring Critical Rendering Path
 
Ustream Techtalks: Google Chrome Developer Tools
Ustream Techtalks: Google Chrome Developer ToolsUstream Techtalks: Google Chrome Developer Tools
Ustream Techtalks: Google Chrome Developer Tools
 
Dev tools rendering & memory profiling
Dev tools rendering & memory profilingDev tools rendering & memory profiling
Dev tools rendering & memory profiling
 
Google Chrome DevTools: Rendering & Memory profiling on Open Academy 2013
Google Chrome DevTools: Rendering & Memory profiling on Open Academy 2013Google Chrome DevTools: Rendering & Memory profiling on Open Academy 2013
Google Chrome DevTools: Rendering & Memory profiling on Open Academy 2013
 
Hardware accelerated rendering in WebKit for android
Hardware accelerated rendering in WebKit for androidHardware accelerated rendering in WebKit for android
Hardware accelerated rendering in WebKit for android
 
Html5 more than just html5 v final
Html5  more than just html5 v finalHtml5  more than just html5 v final
Html5 more than just html5 v final
 
Building high performing web pages
Building high performing web pagesBuilding high performing web pages
Building high performing web pages
 
DYNAMIC HYPERTEXT MARKUP LANGUAGE (DHTML) & CSS WITH Application of JavaScript
DYNAMIC HYPERTEXT MARKUP LANGUAGE (DHTML) & CSS WITH Application of JavaScriptDYNAMIC HYPERTEXT MARKUP LANGUAGE (DHTML) & CSS WITH Application of JavaScript
DYNAMIC HYPERTEXT MARKUP LANGUAGE (DHTML) & CSS WITH Application of JavaScript
 
web development
web developmentweb development
web development
 
Please dont touch-3.5
Please dont touch-3.5Please dont touch-3.5
Please dont touch-3.5
 
#Webperf Choreography
#Webperf Choreography#Webperf Choreography
#Webperf Choreography
 
Incremental DOM and Recent Trend of Frontend Development
Incremental DOM and Recent Trend of Frontend DevelopmentIncremental DOM and Recent Trend of Frontend Development
Incremental DOM and Recent Trend of Frontend Development
 
Responsive Web Design: Clever Tips and Techniques
Responsive Web Design: Clever Tips and TechniquesResponsive Web Design: Clever Tips and Techniques
Responsive Web Design: Clever Tips and Techniques
 
Please Don't Touch the Slow Parts V3
Please Don't Touch the Slow Parts V3Please Don't Touch the Slow Parts V3
Please Don't Touch the Slow Parts V3
 
Trendsetting: Web Design and Beyond
Trendsetting: Web Design and BeyondTrendsetting: Web Design and Beyond
Trendsetting: Web Design and Beyond
 
WEB DEVELOPMENT.pptx
WEB DEVELOPMENT.pptxWEB DEVELOPMENT.pptx
WEB DEVELOPMENT.pptx
 
Masterin Large Scale Java Script Applications
Masterin Large Scale Java Script ApplicationsMasterin Large Scale Java Script Applications
Masterin Large Scale Java Script Applications
 
"Responsive Web Design: Clever Tips and Techniques". Vitaly Friedman, Smashin...
"Responsive Web Design: Clever Tips and Techniques". Vitaly Friedman, Smashin..."Responsive Web Design: Clever Tips and Techniques". Vitaly Friedman, Smashin...
"Responsive Web Design: Clever Tips and Techniques". Vitaly Friedman, Smashin...
 

Recently uploaded

BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdfBT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
Neo4j
 
Observability For You and Me with OpenTelemetry
Observability For You and Me with OpenTelemetryObservability For You and Me with OpenTelemetry
Observability For You and Me with OpenTelemetry
Eric D. Schabell
 
How to Build a Profitable IoT Product.pptx
How to Build a Profitable IoT Product.pptxHow to Build a Profitable IoT Product.pptx
How to Build a Profitable IoT Product.pptx
Adam Dunkels
 
20240702 Présentation Plateforme GenAI.pdf
20240702 Présentation Plateforme GenAI.pdf20240702 Présentation Plateforme GenAI.pdf
20240702 Présentation Plateforme GenAI.pdf
Sally Laouacheria
 
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Chris Swan
 
The Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU CampusesThe Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU Campuses
Larry Smarr
 
Password Rotation in 2024 is still Relevant
Password Rotation in 2024 is still RelevantPassword Rotation in 2024 is still Relevant
Password Rotation in 2024 is still Relevant
Bert Blevins
 
WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck
Lidia A.
 
7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf
Enterprise Wired
 
Cookies program to display the information though cookie creation
Cookies program to display the information though cookie creationCookies program to display the information though cookie creation
Cookies program to display the information though cookie creation
shanthidl1
 
Recent Advancements in the NIST-JARVIS Infrastructure
Recent Advancements in the NIST-JARVIS InfrastructureRecent Advancements in the NIST-JARVIS Infrastructure
Recent Advancements in the NIST-JARVIS Infrastructure
KAMAL CHOUDHARY
 
Mitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing SystemsMitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing Systems
ScyllaDB
 
The Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive ComputingThe Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive Computing
Larry Smarr
 
Implementations of Fused Deposition Modeling in real world
Implementations of Fused Deposition Modeling  in real worldImplementations of Fused Deposition Modeling  in real world
Implementations of Fused Deposition Modeling in real world
Emerging Tech
 
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
Bert Blevins
 
What's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptxWhat's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptx
Stephanie Beckett
 
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-InTrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc
 
Measuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at TwitterMeasuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at Twitter
ScyllaDB
 
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptxRPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
SynapseIndia
 
Pigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdfPigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdf
Pigging Solutions
 

Recently uploaded (20)

BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdfBT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
BT & Neo4j: Knowledge Graphs for Critical Enterprise Systems.pptx.pdf
 
Observability For You and Me with OpenTelemetry
Observability For You and Me with OpenTelemetryObservability For You and Me with OpenTelemetry
Observability For You and Me with OpenTelemetry
 
How to Build a Profitable IoT Product.pptx
How to Build a Profitable IoT Product.pptxHow to Build a Profitable IoT Product.pptx
How to Build a Profitable IoT Product.pptx
 
20240702 Présentation Plateforme GenAI.pdf
20240702 Présentation Plateforme GenAI.pdf20240702 Présentation Plateforme GenAI.pdf
20240702 Présentation Plateforme GenAI.pdf
 
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
Fluttercon 2024: Showing that you care about security - OpenSSF Scorecards fo...
 
The Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU CampusesThe Increasing Use of the National Research Platform by the CSU Campuses
The Increasing Use of the National Research Platform by the CSU Campuses
 
Password Rotation in 2024 is still Relevant
Password Rotation in 2024 is still RelevantPassword Rotation in 2024 is still Relevant
Password Rotation in 2024 is still Relevant
 
WPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide DeckWPRiders Company Presentation Slide Deck
WPRiders Company Presentation Slide Deck
 
7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf7 Most Powerful Solar Storms in the History of Earth.pdf
7 Most Powerful Solar Storms in the History of Earth.pdf
 
Cookies program to display the information though cookie creation
Cookies program to display the information though cookie creationCookies program to display the information though cookie creation
Cookies program to display the information though cookie creation
 
Recent Advancements in the NIST-JARVIS Infrastructure
Recent Advancements in the NIST-JARVIS InfrastructureRecent Advancements in the NIST-JARVIS Infrastructure
Recent Advancements in the NIST-JARVIS Infrastructure
 
Mitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing SystemsMitigating the Impact of State Management in Cloud Stream Processing Systems
Mitigating the Impact of State Management in Cloud Stream Processing Systems
 
The Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive ComputingThe Rise of Supernetwork Data Intensive Computing
The Rise of Supernetwork Data Intensive Computing
 
Implementations of Fused Deposition Modeling in real world
Implementations of Fused Deposition Modeling  in real worldImplementations of Fused Deposition Modeling  in real world
Implementations of Fused Deposition Modeling in real world
 
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
Understanding Insider Security Threats: Types, Examples, Effects, and Mitigat...
 
What's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptxWhat's New in Copilot for Microsoft365 May 2024.pptx
What's New in Copilot for Microsoft365 May 2024.pptx
 
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-InTrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
TrustArc Webinar - 2024 Data Privacy Trends: A Mid-Year Check-In
 
Measuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at TwitterMeasuring the Impact of Network Latency at Twitter
Measuring the Impact of Network Latency at Twitter
 
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptxRPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
RPA In Healthcare Benefits, Use Case, Trend And Challenges 2024.pptx
 
Pigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdfPigging Solutions Sustainability brochure.pdf
Pigging Solutions Sustainability brochure.pdf
 

Chrome Internals: Paint and Composition