A rather geeky/technical weblog, est. 2001, by Bramus
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 …
React Interface without (left) and with (right) animations In this article, I am going to use the official components from React.js addons. There are other components/libraries that are better for the job but at the end of the article you will get a good amount of React.js animation practice to better understand these other components. …
In the following article we’ll outline the beginnings of the project, some of the challenges we encountered and ultimately what we learned from the process of redesigning Ryanair’s boarding pass. Difference between this redesign and many of the Dribble shots that can be found online is that this one was actually tested early on, and …
Nodal is a web server for Node.js, optimized for building API services quickly and efficiently. Boasting its own opinionated, explicit, idiomatic and highly-extensible framework, Nodal takes care of all of the hard decisions for you and your team. This allows you to focus on creating an effective product in a short timespan while minimizing technical …
Continue reading “Nodal – API Services Made Easy With Node.js”