 Welcome back! It's been 12 weeks since our last What's New, which was for Chrome 68. We skipped 69 because the team was mostly fixing bugs. Here's what's new in Chrome 70. With live expressions, you can monitor the value of any JavaScript expression in real time. In this demo, I need to check that focus works correctly. First, I'll add a new style rule to make it easier to see which element has focus. How about a border of 5 pixels, solid, and fuchsia? As I tap through, it looks like focus disappears between pasta and sandwich, so let's use a live expression to figure out what's happening. Open the console, click Create live expression, type document.activeElement, then click outside of the expression to save it. Now, when I tap through the page, my live expression shows me what element has focus. It looks like somebody snuck an element with the ID tofu into the page. To search for this element in the Elements panel, I can press Command-F on Mac or Control-F on Windows, Linux, and Chrome OS, and then type tofu. Sure enough, there's the hidden element. By the way, this search box supports CSS selectors and XPath. EagerEvaluation now highlights DOM nodes. Here on the Google homepage, I have selected the input box. Typing $0 in the console gives me a reference to that element. When I type $0.parentElement, DevTools highlights the parent of the input in the viewport. Pretty much any expression that evaluates to a node will highlight that node in the viewport, such as document.querySelectorImage. You can now enable network throttling from the command menu. Press Command-Shift-P on Mac or Control-Shift-P on Windows, Linux, and Chrome OS to open the command menu. Type 3G and you now have options to enable fast 3G or slow 3G. When I run the command, a little warning icon pops up next to the network tab to remind me that I have throttling enabled. This is also where I can disable throttling. By the way, you can do other handy stuff from the command menu, such as opening files and running snippets. Type question mark to see your options. The conditional breakpoints UI now supports autocomplete. To set a conditional breakpoint in the sources panel, right-click the line number, then select Add Conditional Breakpoint. The breakpoint will only trigger when the expression that you enter evaluates to true. As you type, the autocomplete UI now pops up to help you type out your expressions faster and more accurately. The EventListener Breakpoints pane now supports Web Audio Lifecycle events. Here on this demo, I'm making moody songs in A minor. I want to see the code that initializes the audio context. So I go to the sources panel, then expand the EventListener Breakpoint section, then expand the Web Audio section, then check Create Audio Context. I'm assuming this audio context is probably created on page load, so let's reload the page and see what happens. As expected, I pause on the line of code that initializes the audio context, even though I had no idea where that code was located. We've got a new experimental debugger for Node called NDB, and we'd like feedback on it. On top of the usual Node debugging features that you get through DevTools, it also lets you detect and attach to child processes, place breakpoints before modules are required, and edit files within the DevTools UI. Check out the NDB GitHub repo and let us know what you think. Here's a bonus tip. With the User Timing API, you can measure how long it takes your real users to complete critical journeys through your app. And the performance panel lets you visualize these measurements while you profile the page. In this demo, I want to measure how long it takes users to complete the form. Let's look at my sloppy code. When the user first enters input, I mark the time by calling window.performance.mark. When they click the submit button, I add another mark to note the completion of the journey. I then calculate the duration with window.performance.measure. In this case, I'm calling the journey form interaction. I can extract the duration of the journey using window.performance.getEntriesByName, which allows me to send the data to my analytics service. To visualize the journey in DevTools, open the performance panel, start a runtime recording, complete the form, click submit, and then stop the recording. DevTools processes everything that happened on the page and shows a chronological log of all the activity. In the user timing section, I can see my custom form interaction journey. This makes it easy to see what activity occurred while I was completing the form interaction journey. Thanks for watching. Send me questions and feedback in the comments.