Thanks to some absolute positioning, hue-rotation, and even some clipping you can create nice split emoji: I especially like the experiments near the lower part of the demo, where one emoji is used as a modifier for the other (e.g. the 🎩 is placed on top of 😁, yielding a new emoji). They remind me …
Author Archives: Bramus!
JavaScript Array#map(), reduce(), and filter()
In The Trouble With Loops I found these nice and simple examples covering Array#map(), Array#reduce(), and Array#filter(). const dollars = [32, 45, 50]; // map(): When you want to translate values in an array into another set of values. const euros = dollars.map(eachAmount => eachAmount * .93); // reduce(): When you want a total based …
Continue reading “JavaScript Array#map(), reduce(), and filter()“
Rogue One: The Battle of Scarif
Speaking of Rogue One: Maple Films have released a fan edit of Rogue One, entitled “Rogue One: The Battle of Scarif”. If you’re in the mood to watch Rogue One but would rather skip the attempts at character development and Forest Whitaker’s pet tentacle monster, pull up Rogue One: The Battle of Scarif and jump …
Dunkirk
Really looking forward to this one: Allied soldiers from Belgium, the British Empire, Canada, and France are surrounded by the German army and evacuated during a fierce battle in World War II. Back in December I was in Brussels to see an IMAX showing of Rogue One. One of the trailers preceding the main feature …
JavaScript: From Callbacks to Promises to Async/Await in 7 seconds
Hide menu bar icons on your Mac with Vanilla
45% Faster React Stateless (Functional) Components
When using Stateless Components throughout your React app, the lifecycle events (componentWillMount, componentDidMount, etc.) are still executed. Developer Philippe Lehoux found a way to bypass these, resulting in a 45% speed improvement: What if we could skip React internals for these components? Instead of mounting them as components, let’s just call them as what they …
Continue reading “45% Faster React Stateless (Functional) Components”
Blade Runner 2049 Trailer
Pure CSS Crossword (CSS Grid)
Nice demo of a pure CSS Crossword Puzzle, built using CSS Grid. Be sure to check out the validation rules too, they’re built using the General Sibling Selector (e.g. ~): #item1-1:valid ~ #item1-2:valid ~ #item1-3:valid ~ #item1-4:valid ~ #item1-5:valid ~ #item1-6:valid ~ .crossword-board–highlight .crossword-board__item-highlight–across-1 { opacity: 1; } UPDATE 2017.06.22: There’s a blogpost available, describing …
Phonetic Custom LEGO Heads for Stopmotion Animation
Now this is great; A set of 12 custom LEGO heads to create moving lips, mimicking natural speech, in your stopmotion animation: We worked with professional animators to create a set of 12 high grade phonic heads, each with the mouth in the correct shape for a different phonetic sound. By swapping these heads during …
Continue reading “Phonetic Custom LEGO Heads for Stopmotion Animation”