Video · 25 min talk

Adaptive loading: improving web performance on slow devices

Nate Schloss and Addy Osmani · web.dev (Chrome Dev Summit talk writeup) Free Intermediate

A talk (with writeup) on serving a genuinely different, lighter experience to low end devices and slow networks, drawing on how Facebook and others do it in practice. It pushes past image tricks into loading fewer features and lighter components when the device is weak. Watch it when you are ready to design tiers of experience rather than one page for everyone.

  • Adapt the whole experience, not just image quality, to the device
  • Weak devices can get fewer, lighter components on purpose
  • Detecting device and network capability is now practical in the browser
Open on web.dev ↗

The question it answers

  1. How do I design for users in India who are on cheap Android phones and slow, patchy internet?

Read with it

  1. This is Google's own field research on building for people coming online in markets like India, and it names the exact... Google Design Article · ~12 min read Connectivity, Culture, and Credit: Designing for the Next Billion Users Google Design (Next Billion Users team)
  2. You cannot fix what you never feel, and most of us build on fast laptops and office wifi. This is the official doc for... Chrome for Developers Tool · Reference doc, ~10 min to try Throttling (Network and CPU) in Chrome DevTools Chrome DevTools team, Google
  3. Video · About 40 minutes Challenges and learnings of building for the next billion users (Google I/O '18) Google (Next Billion Users team: Nithya Sambasivan, Josh Woodward and colleagues)
  4. Images are the single biggest reason landing pages crawl on a slow 4G connection, and Squoosh fixes that in your browser with... Google Chrome Labs Tool · A few minutes per image Squoosh Google Chrome Labs
  5. Flipkart serves exactly your users, many on 2G in smaller Indian cities, and this case study shows a fast mobile web app... web.dev (Google) Article Flipkart triples time-on-site with a Progressive Web App web.dev (Google)
  6. A first hand engineering account of why Flipkart, an app first Indian company, rebuilt the mobile web to reach users on weak... Medium (Progressive Web Apps) Article Building Flipkart Lite: A Progressive Web App Aditya Punjani
eChai Partner Brands The partnership →