Skip to content

Instantly share code, notes, and snippets.

@paulirish
paulirish / what-forces-layout.md
Last active May 8, 2026 17:53
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
@hbin
hbin / cors-nginx.conf
Last active July 1, 2016 01:17 — forked from alexjs/cors-nginx.conf
Slightly tighter CORS config for nginx
#
# Slightly tighter CORS config for nginx
#
# A modification of https://gist.github.com/1064640/ to include a white-list of URLs
#
# Despite the W3C guidance suggesting that a list of origins can be passed as part of
# Access-Control-Allow-Origin headers, several browsers (well, at least Firefox)
# don't seem to play nicely with this.
#
@koistya
koistya / React-Directory-Layout.md
Last active July 30, 2025 05:53
File and folder naming convention for React.js components

File and folder naming convention for React.js components

Directory Layout #1

/actions/...
/components/common/Link.js
/components/common/...
/components/forms/TextBox.js
/components/forms/TextBox.res/style.css
@addyosmani
addyosmani / package.json
Last active December 28, 2024 12:07
npm run-scripts boilerplate
{
"name": "my-app",
"version": "1.0.0",
"description": "My test app",
"main": "src/js/index.js",
"scripts": {
"jshint:dist": "jshint src/js/*.js",
"jshint": "npm run jshint:dist",
"jscs": "jscs src/*.js",
"browserify": "browserify -s Validating -o ./dist/js/build.js ./lib/index.js",
@yahyaKacem
yahyaKacem / string_converter.py
Created December 29, 2013 13:51
Convert camel-case to snake-case in python. e.g.: CamelCase -> snake_case e.g.: snake_case -> CamelCase e.g.: CamelCase -> dash-case e.g.: dash-case -> CamelCase By: Jay Taylor [@jtaylor] Me<modifier>: Yahya Kacem <fuj.tyoli@gmail.com> Original gist: https://gist.github.com/jaytaylor/3660565
#!/usr/bin/env python
"""
Convert camel-case to snake-case in python.
e.g.: CamelCase -> snake_case
e.g.: snake_case -> CamelCase
e.g.: CamelCase -> dash-case
e.g.: dash-case -> CamelCase
By: Jay Taylor [@jtaylor]
Me<modifier>: Yahya Kacem <fuj.tyoli@gmail.com>
Original gist: https://gist.github.com/jaytaylor/3660565
@Stanback
Stanback / nginx.conf
Last active February 6, 2026 04:08 — forked from michiel/cors-nginx.conf
Example Nginx configuration for adding cross-origin resource sharing (CORS) support to reverse proxied APIs
#
# CORS header support
#
# One way to use this is by placing it into a file called "cors_support"
# under your Nginx configuration directory and placing the following
# statement inside your **location** block(s):
#
# include cors_support;
#
# As of Nginx 1.7.5, add_header supports an "always" parameter which
@alexjs
alexjs / cors-nginx.conf
Created November 28, 2012 22:42 — forked from michiel/cors-nginx.conf
Slightly tighter CORS config for nginx
#
# Slightly tighter CORS config for nginx
#
# A modification of https://gist.github.com/1064640/ to include a white-list of URLs
#
# Despite the W3C guidance suggesting that a list of origins can be passed as part of
# Access-Control-Allow-Origin headers, several browsers (well, at least Firefox)
# don't seem to play nicely with this.
#