Meta Refresh 2015

The web in your pocket

#Perffirst - Optimizing the Critical Rendering Path

Submitted by Brameshmadhav Srinivasan (@sbmadhav) on Monday, 12 January 2015

videocam
Preview video

Technical level

Beginner

Section

Performance – crisp talk

Status

Confirmed & Scheduled

View proposal in schedule

Vote on this proposal

Login to vote

Total votes:  +19

Objective

  • Understand the browser’s Critical rendering Path
  • How to use the modern day tools (dev tools, firebug etc) to improve Performance by optimizing the Critical rendering path
  • Demo of pages before and after optimization
  • How to use page insights and other tools to analyse the performace of the page.

Description

Delivering a fast web experience requires a lot of work by the browser. Most of this work is hidden from us as web developers: we write the markup, and a nice looking page comes out on the screen. But how exactly does the browser go from consuming our HTML, CSS, and JavaScript to rendered pixels on the screen?

Optimizing for performance is all about understanding what happens in these intermediate steps between receiving the HTML, CSS, and JavaScript bytes and the required processing to turn them into rendered pixels - that’s the critical rendering path.

Optimizing the critical rendering path is critical for improving performance of our pages. The goal is to prioritize and display the content that relates to the primary action the user wants to take on a page.

Requirements

A laptop to work out examples as I show them. Also, a good pre-read would be http://juvenileoutpost.blogspot.in/2015/03/perffirst-understanding-critical.html

Speaker bio

  • Pursuing a career in the field of Information Technology for about 5 and a half years now
  • Appreciating the nuances of how the ‘job gets done’ across different industries’s IT needs
  • Startup oriented (Love the concept of Lean startup and Minimum viable product)
  • Passionate about programming and learning new technologies.
  • Learning from and contributing to various open source technologies and forums
  • Extensive experience as a Java and JavaScript toolkit programmer. Beginner skills in Hack, Dart and Nodejs

Links

Slides

http://www.slideshare.net/sbmadhav/optimizing-the-critical-rendering-path-meta-refresh-2015

Preview video

http://youtu.be/8aV9cbaCp-4

Comments

Login with Twitter or Google to leave a comment