Building a Better Web with Lighthouse
What's new in Lighthouse. Redesign, new best practice audits, and an online report viewer.
lighthouse tools performance progressive-web-apps
URL Bar Resizing
Hiding the URL bar no longer resizes mobile pages.
Chrome DevTools: JavaScript CPU Profiling in Chrome 58
"Record JavaScript CPU Profile" has been changed in Chrome 58.
API Deprecations and Removals in Chrome 56
A round up of the deprecations and removals in Chrome 56 to help you plan.
deprecations removals chrome56
position:sticky is back in Chrome
After a long time absent from Chrome, position:sticky is back.
Take Photos and Control Camera Settings
Image Capture is an API to control camera settings and take photos.
canvas chrome56 chrome61 media webrtc
Performant Parallaxing
When used judiciously paralaxing can add of depth and subtlety to a web app.
performance parallax css 3d style
New In Chrome 55
With Chrome 55, you can write promise-based code as if it were synchronous, using async and await. PointerEvents provide a unified way of handling all input events. And persistent storage graduates from it’s origin trial.
chrome55 new-in-chrome pointerevents async await persistentstorage
Get Ready for the Chrome Dev Summit 2016
Chrome Dev Summit 2016 is coming Thursday, Nov 10th and 11th. This year's summit will focus on key themes that matter to you: Progressive, to build high quality web apps; Performance, to increase user engagement; and What's Next, a look at how the Chrome team is thinking about the future of the web. Learn how you can tune in and see what's going on!
chromedevsummit news video announcement
Avoiding the Not Secure Warning in Chrome
Chrome will soon mark non-secure pages containing password and credit card input fields as Not Secure in the URL bar. This document is intended to aid Web Developers in updating their sites to avoid this warning.
DevTools Digest, October 2016
New Console features, updates on the context selector bug, and the new UC Browser user agent.
Manage Hyphens with CSS
Chrome 55 implements the hyphens property to control when soft hyphens appear and how they behave.
Pointing the Way Forward
Pointer events unify the pointer input model for the browser, bringing touch, pens, and mice together into a single set of events.
API Deprecations and Removals in Chrome 55
A round up of the deprecations and removals in Chrome to help you plan.
deprecations removals chrome55
Capture a MediaStream From a Canvas, Video or Audio Element
The captureStream() method makes it possible to capture a MediaStream from a canvas, video or audio element.
canvas chrome53 gif media security webrtc
Once Upon an Event Listener
Using {once: true}, available in Chrome 55, gives you an easy way to define "one and done" event listeners.
Touch Action Options
Touch action is a simple way to define how a user can interact with an element.
auxclick is Coming to Chrome 55
auxclick takes the place of the click event for non-primary mouse buttons, starting in Chrome 55.
New In Chrome 54
With Chrome 54, you can now create your own custom HTML tag with and make re-usable web components with Custom Elements v1; it’s easier to send messages between open windows or tabs on the same origin with the BroadcastChannel API; media experience get better on Android and foreign fetch is now available as an origin trial.
chrome54 new-in-chrome media webcomponents broadcast foreignfetch fullscreen serviceworker origintrials
Updates to developers.google.com/web
We recently made some big changes to WebFundamentals, improving navigation, adding lots of new content, and making it easier for you to contribute.
Re-rastering Composited Layers on Scale Change
Starting in Chrome 53, all content is re-rastered when its transform scale changes, if it does not have the will-change: transform CSS property. In other words, will-change: transform means "please animate it fast".
API Deprecations and Removals in Chrome 54
An round up of the deprecations and removals in Chrome to help you plan.
deprecations removals chrome54
Cross-origin Service Workers: Experimenting with Foreign Fetch
Third-party services can start deploying their own network request handlers.
chrome54 origintrials serviceworker cors fetch
CacheQueryOptions Arrive in Chrome 54
The full set of CacheQueryOptions are supported, making it easier to find the cached responses you're looking for.
DevTools Digest, September 2016: Perf Roundup
Perf tooling improvements in DevTools over the last few Chrome releases.
Options of a PushSubscription
You can now access the options used when subscribing a user to push.
BroadcastChannel API: A Message Bus for the Web
The BroadcastChannel API allows same-origin scripts to send messages to other browsing contexts. It can be thought of as a simple message bus that allows pub/sub semantics between windows/tabs, iframes, web workers, and service workers.
Intervening against document.write()
Chrome is blocking some scripts that are added using document.write().
Web Animations API Hits Cross-browser Milestone
Firefox 48 joins Chrome in shipping a native implementation of the Web Animations API.
API Deprecations and Removals in Chrome 53
A round up of the deprecations and removals in Chrome to help you plan.
deprecations removals chrome53
DevTools Digest, August 2016
What happened to the Resources panel, new features, and community activity.
Bringing Easy and Fast Checkout with Payment Request API
Payment Request is a new API for the open web that makes checkout flows easier, faster and consistent.
Muted Autoplay on Mobile: Say Goodbye to Canvas Hacks and Animated GIFs!
Muted autoplay for video is supported on Android from Chrome 53. Previously, a video element required a user gesture to initiate playback.
canvas chrome53 gif media security webrtc
Web Push Interoperability Wins
Web push has had a few updates in recent versions of Chrome. GCM now supports the web push protocol and if you use VAPID you won't need to sign up for a Google Developer Project and you'll be given an FCM endpoint.
Offline Google Analytics Made Easy
The sw-offline-google-analytics library gives you everything you need.
serviceworker analytics offline indexeddb
Complexities of an Infinite Scroller
Infinite scrollers are a common UI pattern. Here we explore how to implement this pattern in a memory conservative way that performs at 60fps.
Goodbye Short Sessions: A Proposal for Using Service Workers to Improve Cookie Management on the Web
Introducing a proof of concept design to persist sessions using the Service Worker.
identity sessions cookie serviceworker
ECDSA for WebRTC: Better Security, Better Privacy and Better Performance
From version 52, Chrome uses ECDSA by default — a much more efficient and secure algorithm for WebRTC certificate key generation. In addition, RTCCertificates can now be stored with IndexedDB.
chrome52 media security webrtc
Flexbox Gets New Behavior for absolute-positioned Children
A previous version of the CSS Flexible Box Layout specification set the static position of absolute-positioned children as though they were a flex item whose size is 0px by 0px. The latest version of the spec takes them fully out of flow and sets the static position based on align and justify properties.
css flexbox chrome52 absolute-positioned
Service Worker Caching, PlaybackRate and Blob URLs for Audio and Video on Chrome for Android
From version 52, Android Chrome uses the same media stack as desktop Chrome, rather than relying on the underlying platform implementation. This enables service worker media caching, variable playback rates, blob URLs on Android, MediaStream passing between APIs, and easier cross-platform debugging.
audio chrome52 media recording video webrtc
CSS Containment in Chrome 52
The new CSS Containment property lets developers limit the scope of the browser’s styles, layout and paint work.
performance chrome52 layout paint style containment
API Deprecations and Removals in Chrome 52
An round up of the deprecations and removals in Chrome to help you plan.
deprecations removals chrome52
Performance Observer: Efficient Access to Performance Data
The W3C Performance Timeline specification defines an interface for browsers to provide programmatic access to low level timing data. This opens the door to some interesting use cases like custom performance analysis, third party tools and more.
performance events chrome52 javascript
DevTools Digest: DevTools in 2016 and Beyond
Big themes and trends for DevTools in 2016 and beyond.
Improving Scroll Performance with Passive Event Listeners
New to Chrome 51, passive event listeners provide a major potential boost to scroll performance.
performance events chrome51 javascript scroll touch
Stream Your Way to Immediate Responses
Start processing your service worker responses ASAP, thanks to ReadableStreams.
performance chrome52 streams serviceworker
Houdini: Demystifying CSS
Houdini is a collection of APIs that expose the CSS engine’s internals to developers
DevTools Digest: More Power with the New Command Menu
Read about DevTools' new command menu and its over 60 actions that enable super fast workflows.
Geolocation API Removed from Unsecured Origins in Chrome 50
Starting with version 50, Chrome no longer supports the HTML5 Geolocation API over non-secure connections.
IntersectionObserver’s Coming into View
IntersectionObservers let you know when an observed element enters or exits the browser’s viewport.
API Deprecations and Removals in Chrome 51
An round up of the deprecations and removals in Chrome to help you plan.
deprecations removals chrome51
What’s New with KeyboardEvents? Keys and Codes!
Two new attributes bring consistent keyboard event handling to the web.
Streamlining the Sign-in Flow Using Credential Management API
To provide a sophisticated user experience, it's important to help users authenticate themselves to your website. But creating, remembering and typing passwords tends to be cumbersome for end users, especially on mobile
Experiment Time: Scroll Anchoring
Scroll anchoring stops a web page from moving once you've started reading the content.
interventions scroll-anchoring
A New Device Mode for a Mobile-First Generation
Learn all about Chrome DevTools' new, refreshed Device Mode introduced in Chrome 49.
Creating a Web-Enabled IoT Device with Intel Edison
Internet of Things is really on everyone's lips these days, but what if you could create an IoT device which you accessed from your web browser? In this article we look at how you can do exactly that using Physical Web, Web Bluetooth as well as Node.js, running on an Intel® Edison Arduino breakout board.
news iot webbluetooth physicalweb edison
Removing Headaches from Focus Management
The 'sequential focus navigation starting point' feature defines where we start to search for focusable elements for sequential focus navigation ([Tab] or [Shift-Tab]) when there is no focused area. It's especially helpful for accessibility features like skip links and managing focus in the document.
Media Source API: Automatically Ensure Seamless Playback of Media Segments in Append Order
The Media Source API enables JavaScript to construct media streams for playback. From Chrome 50, it's possible to use SourceBuffer sequence mode to ensure media segments are automatically relocated in the timeline in the order they were appended, without gaps between them.
audio chrome50 media mse recording video webrtc chrome50
API Deprecations and Removals in Chrome 50
An round up of the deprecations and API removals in Chrome to help you plan.
deprecations removals chrome50
Web Animations Improvements in Chrome 50
Better specification compliance and new features coming in Chrome 50.
webanimations chrome50 chrome51
Canvas toBlob() Support Added in Chrome 50
Support for canvas.toBlob set to land in Chrome 50.
images performance workers chrome50
Chrome Supports createImageBitmap() in Chrome 50
Support for image decoding in workers set to land in Chrome 50.
images performance workers chrome50
DOMTokenList Validation Added in Chrome 50
Check support for various features directly in code, coming in Chrome 50.
domtokenlist validation chrome50
FormData Methods for Inspection and Modification
In Chrome 50, you can now interact with your FormData instances before sending them on their journey.
Web Notification Improvements in Chrome 50: Icons, Close Events, Renotify Preferences and Timestamps
There are lots of great new features in Chrome 50 for Notifications, here is a rundown.
Web Push Payload Encryption
Web Push now supports payloads! Find out how to take advantage of this powerful new feature.
notifications webpush payload encryption chrome50
Device Orientation Changes Are Coming to Chrome 50
DeviceOrientationEvent uses relative degrees, and there's a new DeviceOrientationAbsoluteEvent.
Prioritizing Your Resources with link rel='preload'
Chrome 50 adds support for rel='preload', and deprecates rel='subresource'
link preload performance chrome50
HTMLMediaElement.play() Returns a Promise
Say goodbye to automatic playback uncertainty! play() now returns a Promise.
promises play video audio chrome50
Supercharged Remote Debugging, Class Toggles and Our Own Late Night Show?!
Learn all about the revamped “Inspect Devices” UI, toggle classes easily in the now-fixed style panel and watch the pilot of DevTools Tonight.
devtools digest update chrome49
DevTools Go Dark, @keyframe Editing and Smarter Autocomplete
Learn how DevTools makes you type less with smarter Console autocomplete, how to edit @keyframe rules directly in the Styles pane, how to have fun with CSS Custom Variables and how to join the dark side.
devtools digest update chrome49
Web Audio Updates in Chrome 49
A round up of some of the latest editions to the Web Audio API in Chrome.
Smooth Scrolling in Chrome 49
Tired of jittery scrolling? Great, because Chrome 49 is shipping with a new smooth scroll right out of the box!
Introducing ES2015 Proxies
ES2015 Proxies (in Chrome 49 and later) provide JavaScript with an intercession API, enabling us to trap or intercept all of the operations on a target object and modify how this target operates.
API Deprecations and Removals in Chrome 49
An round up of the deprecations and API removals in Chrome to help you plan.
deprecations removals chrome49
Controlling Font Performance with font-display
The new font-display descriptor for @font-face lets developers decide how their web fonts will render (or fallback), depending on how long it takes for them to load.
CSS Variables: Why Should You Care?
CSS variables, more accurately known as CSS custom properties, are landing in Chrome 49. They can be useful for reducing repetition in CSS, and also for powerful runtime effects like theme switching and potentially extending/polyfilling future CSS features.
Record Audio and Video with MediaRecorder
The MediaRecorder API enables you to record audio and video from a web app. It's available now in Firefox and in Chrome for Android and desktop.
audio codecs media news recording video webrtc chrome49
VP9 Is Now Available in WebRTC
From Chrome 48 on desktop and Android, VP9 will be an optional video codec for video calls using WebRTC.
audio codecs media news video vp9 webrtc
Notification Actions in Chrome 48
Users can interact with your site without opening up the page by using Notification Action buttons
High Resolution Timestamps for Events
Find out when events occur with microsecond precision, thanks to DOMHighResTimeStamp.
Easy URL Manipulation with URLSearchParams
URLSearchParams trivial access and manipulation of the URL's query string
