Skip to content

Instantly share code, notes, and snippets.

View KittyGiraudel's full-sized avatar
🐈

Kitty Giraudel KittyGiraudel

🐈
View GitHub Profile
@Tom-Bonnike
Tom-Bonnike / tiny-serialize.js
Last active November 24, 2020 21:56
Tiny form serialization helper
function serializeForm(form, urlEncode = false) {
const formData = new FormData(form);
if (urlEncode) {
const searchParams = new URLSearchParams(formData)
return searchParams.toString();
}
const serializedFormData = {};
@schmich
schmich / npm-prerelease.md
Last active January 3, 2024 18:19
Publish a prerelease package to NPM
  • Update package.json, set version to a prerelease version, e.g. 2.0.0-rc1, 3.1.5-rc4, ...
  • Run npm pack to create package
  • Run npm publish <package>.tgz --tag next to publish the package under the next tag
  • Run npm install --save package@next to install prerelease package
@paulirish
paulirish / what-forces-layout.md
Last active May 6, 2024 07:54
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
@oilvier
oilvier / bookmark.js
Last active February 14, 2024 10:29
Javascript to add a bookmark - Cross Browser
/**
*
* Add to bookmark
* Several tests are necessary in order for this "simple" action to work in most of the browsers
*
*/
// First, we define the element where the "Add to bookmark" action will trigger
var triggerBookmark = $(".js-bookmark"); // It must be an `a` tag
@addyosmani
addyosmani / README.md
Last active April 2, 2024 20:18 — forked from 140bytes/LICENSE.txt
108 byte CSS Layout Debugger

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version

@sindresorhus
sindresorhus / post-merge
Last active May 2, 2024 03:18
git hook to run a command after `git pull` if a specified file was changed.In this example it's used to run `npm install` if package.json changed and `bower install` if `bower.json` changed.Run `chmod +x post-merge` to make it executable then put it into `.git/hooks/`.
#!/usr/bin/env bash
# MIT © Sindre Sorhus - sindresorhus.com
# git hook to run a command after `git pull` if a specified file was changed
# Run `chmod +x post-merge` to make it executable then put it into `.git/hooks/`.
changed_files="$(git diff-tree -r --name-only --no-commit-id ORIG_HEAD HEAD)"
check_run() {
echo "$changed_files" | grep --quiet "$1" && eval "$2"