Skip to content

Instantly share code, notes, and snippets.

@slikts
slikts / react-memo-children.md
Last active June 16, 2024 14:24
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
@zcaceres
zcaceres / Sequelize-Step-by-Step.md
Last active February 22, 2023 12:53
Let's get an overview of Sequelize!

Sequelize: Step-By-Step

Sequelize is a powerful library in Javascript that makes it easy to manage a SQL database. Sequelize can layer over different protocols, but here we'll use PostgreSQL. At its core, Sequelize is an Object-Relational Mapper – meaning that it maps an object syntax onto our database schemas. Sequelize uses Node.JS and Javascript's object syntax to accomplish its mapping.

Under the hood, Sequelize used with PostgreSQL is several layers removed from our actual database:

  1. First, we write our Sequelize, using Javascript objects to mimic the structure of our database tables.
  2. Sequelize creates a SQL string and passes it to a lower-level library called pg (PostgreSQL).
  3. pg connects to your PostgreSQL database and queries it or transforms its data.
  4. pg passes the data back to Sequelize, which parses and returns that data as a Javascript object.