Skip to content

Instantly share code, notes, and snippets.

@getify
getify / 1.html
Last active May 10, 2023 03:25
Ever noticed how vw/vh units in CSS seem to be a bit unreliable on various devices (especially mobile)? Here's my solution.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
<title>Test Page</title>
<script>
// early compute the vw/vh units more reliably than CSS does itself
computeViewportDimensions();
@paulirish
paulirish / what-forces-layout.md
Last active April 26, 2024 17:33
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
@Neurogami
Neurogami / glitch.rb
Created August 12, 2013 04:56
Simple script to rin perfectly good image files.
#!/usr/bin/env ruby
=begin
Simple script to smack your glitch up.
Call this program with the name of an image file, and two numbers
The first number is used to determine when to mess with a byte in the
image file. If you pass in, say 2000, then even 2000th byte gets tweaked.
@dypsilon
dypsilon / frontendDevlopmentBookmarks.md
Last active March 27, 2024 06:36
A badass list of frontend development resources I collected over time.
@tmcw
tmcw / codemirror_keymap.md
Created May 30, 2013 19:43
CodeMirror keyMap Missing Documentation

An addendum to CodeMirror's keyMap documentation, which unfortunately glosses over the 'connecting the wires' section.

CodeMirror.keyMap.tabSpace = {
    Tab: function(cm) {
        var spaces = Array(cm.getOption("indentUnit") + 1).join(" ");
        cm.replaceSelection(spaces, "end", "+input");
    },
    fallthrough: ['basic']
};