Skip to content

Instantly share code, notes, and snippets.

View garronej's full-sized avatar
🇯🇵
In Tokyo

Joseph Garrone garronej

🇯🇵
In Tokyo
View GitHub Profile
@josephm28
josephm28 / promise-load-css.js
Created March 13, 2019 21:22
Dynamically load CSS using JS, with a promise to know when the style has been loaded. Do it all in bulk
async loadCSSStyles(){
return new Promise((resolve, reject)=>{
const styleURLs = [...];
await Promise.all(styleURLs.map(async style => await fetchStyle(style)));
resolve();
})
})
const fetchStyle = (url) => {
//https://stackoverflow.com/questions/574944/how-to-load-up-css-files-using-javascript
return new Promise((resolve, reject) => {
@slikts
slikts / react-memo-children.md
Last active November 20, 2024 15:48
Why using the `children` prop makes `React.memo()` not work

nelabs.dev

Why using the children prop makes React.memo() not work

I've recently ran into a pitfall of [React.memo()][memo] that seems generally overlooked; skimming over the top results in Google just finds it mentioned in passing in a [React issue][regit], but not in the [FAQ] or API [overview][react-api], and not in the articles that set out to explain React.memo() (at least the ones I looked at). The issue is specifically that nesting children defeats memoization, unless the children are just plain text. To give a simplified code example:

const Memoized = React.memo(({ children }) => (<div>{children}</div>));
// Won't ever re-render
<Memoized>bar</Memoized>
// Will re-render every time; the memoization does nothing