<commit_before>---
layout: updates/post
title: "DevTools Digest: DevTools in 2016 and Beyond"
description: "Big themes and trends for DevTools in 2016 and beyond."
published_on: 2016-06-07
updated_on: 2016-06-07
authors:
  - kaycebasques
tags:
  - devtools
featured_image: /web/updates/images/2016/06/devtools.png
---

Google I/O 2016 is a wrap. DevTools had a strong presence at I/O, including a talk by <NAME>, <NAME>, and <NAME> outlining the future of DevTools. Check out the video below or read on to learn more about where DevTools is headed in 2016 and beyond.

{% ytvideo x8u0n4dT-WI %}

## Authoring

DevTools aims to make every stage of the web development lifecycle easier. You probably know that DevTools can help you debug or profile a website, but you may not know how to use it to help you author a site. By "authoring" we mean the act of creating a site. One of the goals in the foreseeable future is to make it easier for you to iterate, experiment, and emulate your site across multiple devices. 

### Device Mode

The DevTools team continues to iterate on the Device Mode experience, which received its first major upgrade in Chrome 49. Check out the post from March ([A new Device Mode for a mobile-first world](/web/updates/2016/03/device-mode-v2)) for an overview of the updates. The overarching goal is to provide a seamless workflow for viewing and emulating your site across all form factors. 

Here's a quick summary of some Device Mode updates that have landed in Canary since we posted the article back in March. 

When viewing a page as a specific device, you can immerse yourself more in the experience by showing the device hardware around your page. 

![Showing device frame](/web/updates/images/2016/06/device-frame.png)

The device orientation menu lets you view your page when different system UI elements, such as the navigation bar and keyboard, are active.

![Showing system UI elements](/web/updates/images/2016/06/system-ui.png)

The desktop story has improved, too. Thanks to Device Mode's zoom feature, you can emulate desktop screens larger than the screen that you're actually working on, such as a 4K (2560px) screen. 

![Showing a 4K screen](/web/updates/images/2016/06/4k.png)

You can throttle the network directly from the Device Mode UI, rather than having to switch to the Network panel. 

![Network throttling](/web/updates/images/2016/06/throttling.png)<commit_msg>Fix 4k dimensions. Fixes #2981.<commit_after>---
layout: updates/post
title: "DevTools Digest: DevTools in 2016 and Beyond"
description: "Big themes and trends for DevTools in 2016 and beyond."
published_on: 2016-06-07
updated_on: 2016-06-07
authors:
  - kaycebasques
tags:
  - devtools
featured_image: /web/updates/images/2016/06/devtools.png
---

Google I/O 2016 is a wrap. DevTools had a strong presence at I/O, including a talk by <NAME>, <NAME>, and <NAME> outlining the future of DevTools. Check out the video below or read on to learn more about where DevTools is headed in 2016 and beyond.

{% ytvideo x8u0n4dT-WI %}

## Authoring

DevTools aims to make every stage of the web development lifecycle easier. You probably know that DevTools can help you debug or profile a website, but you may not know how to use it to help you author a site. By "authoring" we mean the act of creating a site. One of the goals in the foreseeable future is to make it easier for you to iterate, experiment, and emulate your site across multiple devices. 

### Device Mode

The DevTools team continues to iterate on the Device Mode experience, which received its first major upgrade in Chrome 49. Check out the post from March ([A new Device Mode for a mobile-first world](/web/updates/2016/03/device-mode-v2)) for an overview of the updates. The overarching goal is to provide a seamless workflow for viewing and emulating your site across all form factors. 

Here's a quick summary of some Device Mode updates that have landed in Canary since we posted the article back in March. 

When viewing a page as a specific device, you can immerse yourself more in the experience by showing the device hardware around your page. 

![Showing device frame](/web/updates/images/2016/06/device-frame.png)

The device orientation menu lets you view your page when different system UI elements, such as the navigation bar and keyboard, are active.

![Showing system UI elements](/web/updates/images/2016/06/system-ui.png)

The desktop story has improved, too. Thanks to Device Mode's zoom feature, you can emulate desktop screens larger than the screen that you're actually working on, such as a 4K (3840px x 
2160px) screen. 

![Showing a 4K screen](/web/updates/images/2016/06/4k.png)

You can throttle the network directly from the Device Mode UI, rather than having to switch to the Network panel. 

![Network throttling](/web/updates/images/2016/06/throttling.png)
{'fraction_non_alphanumeric': 0.06476151315789473, 'fraction_numerical': 0.03515625, 'mean_word_length': 4.231182795698925, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 9, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4668583', 'n_tokens_mistral': 1471, 'n_tokens_neox': 1300, 'n_words': 707}