Skip to content

Instantly share code, notes, and snippets.

Avatar

jakub-g jakub-g

View GitHub Profile
@jakub-g
jakub-g / wpt_wishlist.md
Last active Mar 24, 2021
WebPageTest wishlist 2021
View wpt_wishlist.md

0. Filmstrip page

  • There's no link back to waterfall page
  • Custom end time URL param is not validated. I can put -e:99 and will have 99s worth of filmstrip images (while the test was shorter than that)

1. Re-run the test equivalent which allows changing config

Sometimes I have very elaborate test config which I want to reuse, but slightly change one thing (e.g. add one param to URL). I can easily re-run the test with exact same config, but it's not easy to slightly change config and re-run. You need to re-create the config from scratch by checking multiple checkboxes, and hoping you come up with same exact set of params as before

@jakub-g
jakub-g / intro.md
Last active Mar 11, 2021
preact-redux: where can `props` come from
View intro.md
import { compose } from 'redux'
import { connect } from 'react-redux'

compose

compose(func1, func2, func3, func4) === func1(func2(func3(func4))))
@jakub-g
jakub-g / perf_observer_support.md
Last active Mar 22, 2021
PerformanceObserver.supportedEntryTypes
View perf_observer_support.md

Test query

({a: window.PerformanceObserver.supportedEntryTypes, b: window.PerformancePaintTiming, c: navigator.userAgent})

Safari

A TP blog says shipped in TP75 which would mean 12.1 stable but I tested in 12.1 and it's not true. It returns undefined. So I asssume 13.0 (I don't have 13.0 to test).

@jakub-g
jakub-g / es-modules-tooling-config.md
Last active Mar 2, 2021
Configure popular tools to work with ES modules
View es-modules-tooling-config.md

Things to do before you start using ES modules and put "type": "module" in package.json

The correct behavior of all tools is to assume that .js files are in ES modules format. Hence you must convert existing .js files (including config files) to ESM format, or rename them to .cjs if you want to keep them intact.

eslint, prettier

You should rename .eslintrc.js/.prettierrc.js to .cjs extension, or make them a valid JSON with .json extension

doc: eslint prettier

@jakub-g
jakub-g / esmodules-specs.md
Last active Mar 2, 2021
Compatibility of javascript test runners with ES modules
View esmodules-specs.md

Compatibility of JavaScript test runners with "native" ES modules based spec files (import), without additional transpilation and plugins

updated: 2021-03-02

For node-based runners, assuming node or 12.17.0+ or 13.2.0+ (or v12.11.0+ with --experimental-modules command line flag)

mocha (node)

  • .spec.mjs: supported, w/o additional conf
  • .spec.js + "type": "module" in package.json: supported, w/o additional conf
@jakub-g
jakub-g / settings.json
Last active Jul 15, 2021
vscode settings.json dell
View settings.json
{
"files.trimTrailingWhitespace": true,
"window.title": "${rootPath}${separator}${activeEditorMedium}${separator}${appName}",
"workbench.editor.enablePreview": false,
"workbench.editor.enablePreviewFromQuickOpen": false,
"editor.mouseWheelZoom": true,
"window.menuBarVisibility": "default",
"window.titleBarStyle": "custom",
"eslint.autoFixOnSave": true,
"editor.defaultFormatter": "esbenp.prettier-vscode",
@jakub-g
jakub-g / keybindings.json
Last active Jul 15, 2021
vscode keybindings dell
View keybindings.json
[
{
"key": "ctrl+i escape",
"when": "editorTextFocus",
"command": "moveby.calculation",
"args": {
"lineNrEx": "selections[selections.length-1].start.line",
"charNrEx": "selections[selections.length-1].start.character"
}
},
@jakub-g
jakub-g / colored-console-log-browser.js
Last active Feb 18, 2021
In-browser multi colored output in a single console.log
View colored-console-log-browser.js
// https://developer.mozilla.org/en-US/docs/Web/API/Console#Styling_console_output
// https://github.com/mdn/content/pull/2444
console.log('%cCOLORED1%cCOLORED2', 'color:white;background:purple;', 'color:white;background:red;' , 'unformatted')
console.log('%cone%ctwo', 'border-radius:2px;padding:1px 3px;margin:0 1px;color:white;background:darkblue;', 'border-radius:2px;padding:1px 3px;margin:0 1px;color:white;background:rebeccapurple;', 'message')
View github-code-search-syntax.md

GitHub search docs: here

  • org:ORGNAME to filter down to org
  • org:ORGNAME -repo:ORGNAME/NOISY to filter out some repos
  • path:PATH to search by location
  • language:... or extension:... to filter by lang/extension
  • in:file, in:path, in:file,path to include contents or file paths