Time to Interactive (TTI)
This post introduces the Time to Interactive (TTI) metric and explains how to measure it
Two-way communication with service workers
How establish a two-way communication channel between the page and the service worker.
Understanding cookies
Learn about how cookies work and what are first-party and third-party cookies.
What are the parts of a URL?
What's the difference between a host, site and origin? What is an eTLD+1? This article explains.
Use Imagemin to compress images
Uncompressed images bloat your pages with unnecessary bytes. Run Lighthouse to check for opportunities to improve page load by compressing images.
Use push notifications to engage and re-engage users
Use push notifications to engage users with targeted, timely updates.
Use Search Console
Verify ownership then check your site using Search Console.
User Location
Most browsers and devices have access to the user's geographic location. Learn how to work with the user's location in your site and apps.
User preference media features client hints headers
User timing API
Using a PWA in your Android app
How to open a Progressive Web App in an Android app.
Using tabindex
Use the tabindex attribute to explicitly set an element's tab position.
Variable fonts in real life
Sharing a practical guide to variable fonts, with lots of examples.
The <video> and <source> tags
You've properly prepared a video file for the web. You've given it correct dimensions and the correct resolution. You've even created separate WebM and MP4 files for different browsers. For anyone to see it, you still need to add it to a web page.
Going beyond images with basic video for the web
Research shows that web video lead to higher engagement and sales. Even if you haven't added video to your sites yet, it's just a matter of time until you do.
New functionality for developers—brought to you by WebAssembly
A showcase of tools now available on the web thanks to WebAssembly.
WebAssembly Threads ready to try in Chrome 70
WebAssembly thread support has shipped in Chrome 70 under an origin-trial.
Augmented reality: You may already know it
If you've already used the WebXR Device API, you'll be happy to know there's very little new to learn. Entering a WebXR session is largely the same. Running a frame loop is largely the same. The differences lie in configurations that allow content to be shown appropriately for augmented reality.
Building components
Components are the building blocks of modern web applications. What best practices should you follow when building your own components so they can stand the test of time?
Web components: the secret ingredient helping power the web
This post sums up a talk on the state of web components in 2019, given by Kevin Schaaf of the Polymer Project and Caridy Patiño of Salesforce.
Web on Android
Learn how different components can be used to render web content inside Android apps.
Fill OTP forms within cross-origin iframes with WebOTP API
WebOTP API can now receive an OTP from within an iframe.
Web Payments overview
Learn more about Web Payments and how they work.
Updates to the Web Payments APIs
Since the launch of the Payment Request API in Chrome 53 and the Payment Handler API in Chrome 68, there have been quite a few changes made to their respective specifications. This post summarizes those updates and will continue accumulating those API changes.
Web storage overview
WebAPKs on Android
When the user adds your Progressive Web App to their home screen on Android, Chrome automatically generates an APK for you, which we sometimes call a WebAPK. Being installed via an APK makes it possible for your app to show up in the app launcher, in Android's app settings and to register a set of intent filters.
WebAssembly feature detection
Learn how to use the newest WebAssembly features while supporting users across all browsers.
Case Study - A Tale of an HTML5 Game with Web Audio
Developing game audio with the Web Audio API
Getting started with Web Audio API
Mixing positional audio and WebGL
Determine the passkey provider with AAGUID
Relying parties can determine where the passkey comes from by examining AAGUID.
Simpler WebAuthn feature detection
WebAuthn provides interaction with Bluetooth, communication with passkey providers, and autofill support.
Credential Management API Feature Detection Check-up
Credential Management API Feature Detection Check-up
Discoverable credentials deep dive
Learn what are discoverable credentials and how to build user experiences that suit your use case.
Allow passkey reuse across your sites with Related Origin Requests
Learn how to use Related Origin Requests to allow passkey reuse across your sites.
userVerification deep dive
Learn how to use `userVerification` in WebAuthn
A simple TODO list using HTML5 WebDatabases
Quick guide to webfonts via @font-face
WebGL Fundamentals
Making of the World Wonders 3D Globe
Writing augmented reality applications using JSARToolKit
Animating a million letters using Three.js
WebGL orthographic 3D
An introduction to shaders
WebGL transforms
Get started with WebRTC
Send data between browsers with WebRTC data channels
Build WebRTC app backend services
Introducing WebSockets - Bringing Sockets to the Web
What are Progressive Web Apps?
An introduction to Progressive Web Apps (PWAs) and the three pillars that separate them from other web apps.
What is WebAssembly and where did it come from?
An introduction to WebAssembly (sometimes abbreviated Wasm), the portable binary-code format and corresponding text format for executable programs as well as software interfaces for facilitating interactions between such programs and their host environment.
What's new in PageSpeed Insights
Learn about the latest in PageSpeed Insights to help you better measure and optimize your page and site quality.
When to use HTTPS for local development
Customize the window controls overlay of your PWA's title bar
With the Window Controls Overlay feature, developers can customize the title bar of installed PWAs so that their PWAs feel more like apps.
Workbox: your high-level service worker toolkit
Workbox is a high-level service worker toolkit built on top of the Service Worker and Cache Storage APIs. It provides a production-ready set of libraries for adding offline support to web apps.
Integrate PWAs into built-in sharing UIs with Workbox
How to register routes in Workbox so that your Progressive Web App shows up in system-level sharing UIs, alongside platform-specific apps.
New tricks in XMLHttpRequest2
Building web apps with Yeoman and Polymer
Announcing Baseline in action | Blog
Baseline in action is a new series developed to help developers learn how to use Baseline features together to build better user experiences.