Skip to content

Instantly share code, notes, and snippets.

View chenglou's full-sized avatar
💫

Cheng Lou chenglou

💫
View GitHub Profile
@paulirish
paulirish / what-forces-layout.md
Last active August 7, 2026 10:06
What forces layout/reflow. The comprehensive list.

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent
@unitycoder
unitycoder / if-branchless.shader
Last active July 10, 2026 10:02
Avoiding Branching / Conditionals in Shaders Fast No If
"The common wisdom of "don't use conditionals in shaders" is one of my biggest frustrations with how shaders are taught.
step(y, x) _is_ a conditional! It compiles to identical code as:
float val = (x >= y ? 1.0 : 0.0)
or
float val = 0.0;
if (x >= y) val = 1.0;"
https://twitter.com/bgolus/status/1235254923819802626
// Performing shader divisions without diving *rcp = approximation of 1/x
float myDividedVal = myValToDivide * rcp(myDivider);

Rich Hickey on becoming a better developer

Rich Hickey • 3 years ago

Sorry, I have to disagree with the entire premise here.

A wide variety of experiences might lead to well-roundedness, but not to greatness, nor even goodness. By constantly switching from one thing to another you are always reaching above your comfort zone, yes, but doing so by resetting your skill and knowledge level to zero.

Mastery comes from a combination of at least several of the following:

@sebmarkbage
sebmarkbage / QuizAnswer.md
Last active January 11, 2026 02:45
Global Shared [Synchronous] State

setProps - depends on reading the last reconciled props from the current reconciled state of the app, at the time of the call. It also depends on an object that doesn't necessarily need to be there outside reconciliation. This is unlike setState, which is state that needs to be there. setState is queued up and merged at the time of reconciliation. Not at the time of the call. setState has a side-effect but is not a stateful nor mutative API.

isMounted - reads the current state of the tree, which may be stale if you're in a batch or reconciliation.

getDOMNode/findDOMNode - Reads the currently flushed node. This currently relies on the state of the system and that everything has flushed at this time. We could potentially do a forced render but that would still rely on the state of the system allowing us to synchronously being able to force a rerender of the system. Note: in 0.14, refs directly to DOM node will resolve to the DOM node. This allow you to get access to a node at the time of its choos

architectures and whatnot

  1. plain ol' React
let state = initial
render(view(state), element)
  • view is pure!
@manigandham
manigandham / rich-text-html-editors.md
Last active November 30, 2025 19:04
Rich text / HTML editors and frameworks

Strictly Frameworks

Abstracted Editors

These use separate document structures instead of HTML, some are more modular libraries than full editors

@samnang
samnang / gist:1759336
Created February 7, 2012 11:52
Install Bash version 4 on MacOS X
# Install Bash 4 using homebrew
brew install bash
# Or build it from source...
curl -O http://ftp.gnu.org/gnu/bash/bash-4.2.tar.gz
tar xzf bash-4.2.tar.gz
cd bash-4.2
./configure --prefix=/usr/local/bin && make && sudo make install
# Add the new shell to the list of legit shells
@jacaetevha
jacaetevha / gist:3795784
Created September 27, 2012 19:02
Smalltalk syntax on a postcard
exampleWithNumber: x
"A method that illustrates every part of Smalltalk method syntax
except primitives. It has unary, binary, and keyword messages,
declares arguments and temporaries, accesses a global variable
(but not and instance variable), uses literals (array, character,
symbol, string, integer, float), uses the pseudo variables
true false, nil, self, and super, and has sequence, assignment,
return and cascade. It has both zero argument and one argument blocks."
@olivierlacan
olivierlacan / launch_sublime_from_terminal.markdown
Created September 5, 2011 15:50
Launch Sublime Text 2 from the Mac OS X Terminal

Launch Sublime Text 2 from the Mac OS X Terminal

Sublime Text 2 ships with a CLI called subl (why not "sublime", go figure). This utility is hidden in the following folder (assuming you installed Sublime in /Applications like normal folk. If this following line opens Sublime Text for you, then bingo, you're ready.

open /Applications/Sublime\ Text\ 2.app/Contents/SharedSupport/bin/subl

You can find more (official) details about subl here: http://www.sublimetext.com/docs/2/osx_command_line.html

Installation