View intro.md

A few conversations have circled around user-side structural profiling. For context, see React PR #7549: Show React events in the timeline when ReactPerf is active

One particular concern is the measurement overhead. This gist has a benchmarking script (measure.js) for evaluating overhead and initial results.

Results: performance.mark()

Runs about 0.65µs per mark() call. Naturally, that's ~= an overhead of 1ms for 1500 mark()s. image

View devtools-protocol-send-command-and-monitor.md

Playing with the protocol

You can send arbitrary commands over the protocol fairly easily.

WebInspector.sendOverProtocol('Emulation.setDeviceMetricsOverride', nexus5XMetrics());
WebInspector.sendOverProtocol("Emulation.clearDeviceMetricsOverride");

// It returns a promise
View download-node-nightly.sh
#!/bin/bash
# Usage:
# bash download-node-nightly.sh
hasxz=$(which xzcat)
os=$(uname | tr '[A-Z]' '[a-z]')
arch=$(uname -m)
pwd=$(PWD)
View index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>array augmenting: push read vs concat</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/benchmark/1.0.0/benchmark.min.js"></script>
<script src="./suite.js"></script>
</head>
<body>
<h1>Open the console to view the results</h1>
View protocol-v8-inspector-4604d24.json
{
"version": {
"major": "1",
"minor": "1"
},
"domains": [
{
"domain": "Runtime",
"description": "Runtime domain exposes JavaScript runtime by means of remote evaluation and mirror objects. Evaluation results are returned as mirror object that expose object type, string representation and unique identifier that can be used for further object reference. Original objects are maintained in memory unless they are either explicitly released or are released along with the other objects in their object group.",
"types": [
View open-chrome-tabs-in-safari.scpt
tell application "Google Chrome"
set tab_list to every tab in the front window
repeat with the_tab in tab_list
set the_url to the URL of the_tab
tell application "Safari" to open location the_url
end repeat
end tell
View index.html
<head>
...
<meta name="viewport" content="width=device-width">
...
</head>
View appmanifest_221380.acf
"AppState"
{
"AppID" "221380"
"Universe" "1"
"StateFlags" "1026"
}
View npm3 install performance
I have long wanted to understand what was happening during an `npm install`
I finally now have some data on that.
View index.html
<html>
<head>
<script src="modifyme.js"></script>
</head>
<body>
<h1>Testing source map reloading.</h1>
<h3>Open Dev Tools and look in the console.</h3>
<p>Execute the <code>test_sm()</code> function and follow the source links.</p>
</body>
</html>