Skip to content

Instantly share code, notes, and snippets.

View tomByrer's full-sized avatar
🎦
researching video players

Tom Byrer tomByrer

🎦
researching video players
View GitHub Profile
@sapphi-red
sapphi-red / vite-4.3-perf.md
Last active February 12, 2024 13:33
Vite 4.3 performance (2)

Terms

  • times
    • start up time: the time from "the command is executed" to the time "load event is triggered in browser".
    • root HMR time: the time from "the root file is changed" to the time "that file is executed in browser".
    • leaf HMR time: the time from "the leaf file is changed" to the time "that file is executed in browser".
  • cold/hot start
    • cold start: the dependency optimization cache is deleted before each run
    • hot start: the dependency optimization cache exists by each run

Summary

@DoctorDerek
DoctorDerek / Top 10 Advanced VS Code Settings for Senior Developers 1.json
Created November 1, 2021 05:14
Top 10 Advanced VS Code Settings for Senior Developers by Dr. Derek Austin 🥳 https://medium.com/p/46e348351bd6
"workbench.activityBar.visible": false,
"github.copilot.enable": {
"*": true,
"yaml": false,
"plaintext": false,
"markdown": false,
"env": false
},
@swyxio
swyxio / useLocalStorage.js
Last active March 14, 2023 18:27
SSR friendly version of useLocalStorage hook. you can also use this in a library https://github.com/astoilkov/use-local-storage-state
// usage
function Comp() {
const [language, setLanguage] = useLocalStorage('mykey', 'typescript')
}
// definition
function useLocalStorage(key, initialValue) {
const [storedValue, setStoredValue] = React.useState(initialValue);
React.useEffect(() => {
// Get from local storage by key
@prof3ssorSt3v3
prof3ssorSt3v3 / reflect.js
Created September 27, 2020 19:01
How to use the Reflect object in JavaScript to intercept JS object operations
// Reflect Object - built-in object that provides methods for interceptable JavaScript operations
// All methods are static
// has no constructor cannot use `new`
// https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Reflect
const log = console.log;
let alex = {
name: 'Alex',
id: 93,
hello: function (a, b) {
@marvinhagemeister
marvinhagemeister / little-vdom-decompiled.js
Created March 8, 2020 14:13
Jason little-vdom decompiled
/* eslint-disable no-unused-vars */
/* eslint-disable no-else-return */
// JSX constructor, similar to createElement()
export const h = (type, props, ...children) => {
return {
type,
// Props will be an object for components and DOM nodes, but a string for
// text nodes
props,
@swyxio
swyxio / react-router-dom-v6.d.ts
Last active October 4, 2022 00:36
react router dom v6 types - i have not tested this in all cases, nor have i ensured this covers the full api, - this should just be a nice drop in single .d.ts file that covers basic usecases detailed in https://dev.to/emreloper/react-router-v6-in-two-minutes-2i96, including inlining the necessary types for history and react-router
// // with thanks
// https://dev.to/emreloper/react-router-v6-in-two-minutes-2i96
// https://github.com/ReactTraining/react-router/blob/dev/docs/installation/getting-started.md
// https://github.com/DefinitelyTyped/DefinitelyTyped/blob/9d29adedf662de685356f711951ef8b9e8342865/types/react-router/index.d.ts#L1
// https://github.com/DefinitelyTyped/DefinitelyTyped/blob/9d29adedf662de685356f711951ef8b9e8342865/types/react-router-dom/index.d.ts#L1
// // release notes
// https://github.com/ReactTraining/react-router/releases/tag/v6.0.0-alpha.3
declare module "react-router-dom" {
@seanbrwh
seanbrwh / JOBSITES.md
Created December 4, 2019 16:10
List of job searching websites
@necolas
necolas / using-OnLayout.js
Last active September 23, 2020 09:16
React Pressable / OnLayout
/**
* OnLayout is built upon: View (and ResizeObserver), StyleSheet
*/
const elementBreakpoints = {
small: { minWidth: 200 },
medium: { minWidth: 300 }
large: { minWidth: 500 }
};