Skip to content

Instantly share code, notes, and snippets.

View Nooshu's full-sized avatar

Matt Hobbs Nooshu

View GitHub Profile
@Nooshu
Nooshu / index.js
Created January 23, 2021 23:21
Cloudflare worker script for modifying the White House page's HTML and CSS (https://nooshu.github.io/blog/2021/01/23/the-importance-of-font-face-source-order-when-used-with-preload/)
// set the site we are modifying
const site = 'www.whitehouse.gov';
// do this on a fetch
addEventListener('fetch', event => {
const request = event.request
const url = new URL(request.url)
event.respondWith(handleRequest(request))
});
@Nooshu
Nooshu / input.scss
Created December 10, 2020 23:20
Generated by SassMeister.com.
@mixin content-visibility($size: 1000px) {
content-visibility: auto;
contain-intrinsic-size: $size;
}
.outer-wrapper {
max-width: 940px;
margin: 0 auto;
}
@Nooshu
Nooshu / input.scss
Created December 10, 2020 23:12
Generated by SassMeister.com.
@mixin content-visibility($size: 1000px) {
content-visibility: auto;
contain-intrinsic-size: $size;
}
.outer-wrapper {
max-width: 940px;
margin: 0 auto;
padding: 0 0 48px;
}
@Nooshu
Nooshu / convert.sh
Last active November 10, 2020 22:38
Find all PNG's in a directory, convert to WebP / AVIF. Output using the same filename.
## WebP
find ./ -type f -name '*.png' -exec sh -c 'cwebp -lossless $1 -o "${1%.png}.webp"' _ {} \;\n
## AVIF (s=speed / 0-10 / slowest-fastest)
find ./ -type f -name '*.png' -exec sh -c 'avifenc -s 6 $1 -o "${1%.png}.avif"' _ {} \;
@Nooshu
Nooshu / other-run-metrics-filtered.jq
Last active October 8, 2020 13:51
Extract data from WebPageTest and filter out the obvious broken results
#!/usr/bin/env jq -rMf
# Extract other metrics from the run data
# Headers for resulting CSV
["TTFB", "First Contentful Paint", "Start Render", "DOM Complete" , "Fully Loaded"],
# drill down into the runs data
(
.data.runs
# convert the run data into an object and drill down into the run request data
@Nooshu
Nooshu / other-run-metrics.jq
Created October 7, 2020 23:26
Extract other important page load metrics from the WebPageTest API
#!/usr/bin/env jq -rMf
# Extract other metrics from the run data
# Headers for resulting CSV
["TTFB", "First Contentful Paint", "Start Render", "DOM Complete" , "Fully Loaded"],
# drill down into the runs data
(
.data.runs
# convert the run data into an object and drill down into the run request data
@Nooshu
Nooshu / connection-metrics.jq
Created October 7, 2020 22:05
Extract connection information from the WebPageTest API and format as a CSV
#!/usr/bin/env jq -rMf
# Filter to extract DNS, Connect, SSL metrics from WebPageTest run JSON
# Headers for resulting CSV
["DNS", "Connect", "SSL"],
# drill down into the runs data
(
.data.runs
# convert the run data into an object and drill down into the run request data
@Nooshu
Nooshu / inner-structure.json
Created September 30, 2020 22:33
WebPageTest inner API run data structure
{
"Colordepth": "number",
"Dpi": "string",
"Images": "string",
"LastInteractive": "number",
"LayoutShifts": "array",
"PerformancePaintTiming.first-contentful-paint": "number",
"PerformancePaintTiming.first-paint": "number",
"Resolution": "string",
"SpeedIndex": "number",
@Nooshu
Nooshu / full-schema.txt
Created September 30, 2020 21:21
WebPageTest API 'schema'
id
url
summary
testUrl
location
from
connectivity
bwDown
bwUp
latency
@Nooshu
Nooshu / failed.txt
Created August 9, 2020 22:16
Chrome headers for WOFF2 fonts, failed and successful.
:status: 200
content-type: binary/octet-stream
content-length: 67900
date: Tue, 21 Apr 2020 21:50:57 GMT
last-modified: Tue, 21 Apr 2020 14:32:51 GMT
etag: "f38ad40456df126d75363b9d7b12c979"
cache-control: max-age=315360000,immutable
accept-ranges: bytes
server: AmazonS3
x-cache: Hit from cloudfront