Skip to content

Instantly share code, notes, and snippets.

View nolanlawson's full-sized avatar

Nolan Lawson nolanlawson

3.3k followers · 40 following
View GitHub Profile
@nolanlawson
nolanlawson / index.html
Last active May 12, 2021 23:14
Ranges issue repro
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Ranges issue repro</title>
</head>
<body>
<h1>Ranges issue repro</h1>
<label>
Click and then type here:
@nolanlawson
nolanlawson / .gitignore
Last active October 14, 2021 06:40
Shadow DOM style benchmark
node_modules
*.tachometer.json
*.results.json
@nolanlawson
nolanlawson / stats.js
Created May 10, 2021 04:04
Count stats on a web page
({
numNodes: $$('*').length,
numCustomElements: $$('*').filter(_ => customElements.get(_.tagName.toLowerCase())).length,
numUniqueCustomElements: [...new Set([...$$('*').map(_ => _.tagName.toLowerCase())])].filter(_ => customElements.get(_)).length,
numRulesWithoutCrossOrigin: [...document.styleSheets].map(_ => { try { return _.cssRules.length } catch (e) { return 0 }}).reduce((a, b) => a + b, 0)
})
@nolanlawson
nolanlawson / index.html
Created May 4, 2021 18:06
Constructable styles benchmark
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Constructable styles benchmark</title>
<style>
label {
display: block;
margin: 20px 0;
@nolanlawson
nolanlawson / index.html
Created May 1, 2021 18:12
test emoji picker outside of body
<!doctype heml>
<html>
<head>
<emoji-picker></emoji-picker>
<script src="https://unpkg.com/[email protected]/index.js" type="module"></script>
<title>Test emoji picker outside body</title>
</head>
<body>
<h1>Test emoji picker outside body</h1>
</body>
@nolanlawson
nolanlawson / index.html
Last active April 23, 2021 00:45
Truly reduced repro of Firefox shadow style issue
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Truly reduced repro of Firefox shadow style issue</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
pre {
position: fixed;
right: 0;
@nolanlawson
nolanlawson / index.html
Last active April 22, 2021 21:31
Repro Firefox shadow style issue
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Repro Firefox shadow style issue</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
pre {
position: fixed;
right: 0;
@nolanlawson
nolanlawson / index.html
Created April 22, 2021 18:34
Repro Firefox focusin event issue
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Repro Firefox focusin event issue</title>
</head>
<body>
<h1>Repro Firefox focusin event issue</h1>
<div>
@nolanlawson
nolanlawson / index.html
Created April 15, 2021 21:10
Adopted stylesheets benchmark
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Adopted stylesheets benchmark</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
pre {
position: fixed;
right: 0;
@nolanlawson
nolanlawson / index.html
Created April 14, 2021 21:31
Selector perf test, more realistic scenario for attribute values
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Selector perf test (more realistic scenario for attribute values)</title>
<style>
pre {
position: fixed;
right: 0;