A rather geeky/technical weblog, est. 2001, by Bramus
This repository is a community-curated list of flexbox issues and cross-browser workarounds for them. The goal is that if you’re building a website using flexbox and something isn’t working as you’d expect, you can find the solution here. Truth be told, most of the time “something is not as I’d expect” when using flexbox 😛 …
Continue reading “Flexbugs – Flexbox issues and cross-browser workarounds for them.”
A Chrome DevTools Extension, wrapping around Redux DevTools: The Redux DevTools themselves are a live-editing time travel environment for Redux: Lets you inspect every state and action payload Lets you go back in time by “cancelling” actions If you change the reducer code, each “staged” action will be re-evaluated If the reducers throw, you will …
UPDATE 2017.12: For non-Safari browsers (e.g. Chrome, Firefox) you can use overscroll-behavior to solve exactly this. Simply apply overscroll-behavior-y: none; on html, body and be done with it. html, body { overscroll-behavior-y: none; } Safari however does not support it … UPDATE 2021.06: The workaround below no longer seems to work in recent iOS/MobileSafari versions …
Continue reading “Prevent overscroll/bounce in iOS MobileSafari and Chrome (CSS only)”
How to set the Piano Tiles 2 record? Build a robot: Overhead iPhone 6+ processes video of the iPad screen at 120 fps. iPhone tracks tile speed and sends timing info via MIDI over USB through the camera connection kit. Teensy 3.2 receives tile data and sends step/direction to stepper drivers, which smash the tiles …
import {Motion, spring} from 'react-motion'; // In your render: <Motion defaultStyle={{x: 0}} style={{x: spring(10)}}> {value => <div>{value.x}</div>} </Motion> This library provides an alternative, more powerful API for React’s TransitionGroup. For 95% of use-cases of animating components, we don’t have to resort to using hard-coded easing curves and duration. Set up a stiffness and damping for …
Continue reading “Motion Design in React.js with “React Motion””
Video of the talk “Front-End Performance: The Dark Side” by Mathias Bynens which he gave at Fronteers Spring Conference 2016 which I attended: In security-sensitive situations, performance can actually be a bug rather than a feature. This presentation covers timing attacks on the web, and demonstrates how modern performance-related web APIs can sometimes have a …
Continue reading “Front-End Performance: The Dark Side @ Fronteers Spring Conference 2016”
Today I learned: In JavaScript it is possible to use the + operator alone before a single element. This indicates a math operation and tries to convert the element to a number. If the conversion fails, it will evaluate to NaN. This is especially useful when one wants to convert a string to a number …