A rather geeky/technical weblog, est. 2001, by Bramus
This is crazy: Pose Animator takes a 2D vector illustration and animates its containing curves in real-time based on the recognition result from PoseNet and FaceMesh. It borrows the idea of skeleton-based animation from computer graphics and applies it to vector characters. Built on top of PoseNet to track the body’s pose, and the aforementioned …
Continue reading “Pose Animator – Animate SVG Illustrations using your Camera”
The author of PHPUnit was a bit surprised when he received a mail stating that PHPUnit was a security risk and hackers could remotely execute PHP code through a file named eval-stdin.php that ships used to ship with PHPUnit. // eval-stdin.php eval ('?>'. \file_get_contents('php://input')); Even though the eval-stdin.php file itself indeed was vulnerable, it never …
To crop uploaded images, Twitter doesn’t simply cut them off starting from the center. After first having used Face Detection, they – in 2018 already – switched to AI to cleverly crop uploaded images. Previously, we used face detection to focus the view on the most prominent face we could find. While this is not …
Continue reading “Cleverly Cropping Images on Twitter using AI”
Nice pen by Aaron Iker: It combines CSS Custom Properties, CSS Transitions, and SVG Animations using stroke-dashoffset/stroke-dasharray. The reason that it works with text that spans multiple lines is because of the (inline) span that’s being used inside the link.
The folks at Percona have benchmarked TCP/IP vs. Unix Connections to a local MySQL server. When connecting to a local MySQL instance, you have two commonly used methods: use TCP/IP protocol to connect to local address – localhost or 127.0.0.1 – or use Unix Domain Socket. If you have a choice (if your application supports …
Continue reading “Need to Connect to a Local MySQL Server? Use Unix Domain Socket!”
To use Tailwind – or any prebuilt CSS library/framework for that matter – in a React app you can simply import its generated CSS file and use the classes it exposes: import ‘../tailwind.generated.css’; // … const Alert = ({ title = '', message }) => ( <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative" …
Continue reading “Use Tailwind classes within any CSS-in-JS library with Twin”
React.memo()
I know I’ve posted a similar article before but this is a pitfall I commonly see and therefore it can’t be repeated enough. React internally already optimizes the performance quite a bit without having to explicitly optimize for performance. React.memo can help you to optimize the number of renders of your React components even further. …
Continue reading “React Performance Optimization with React.memo()“
The Facebook Engineering Team on how they’ve built the new Facebook.com – a version which I’ve been able to try for nearly two months by now. Throughout the process, we anchored our work around two technical mantras: As little as possible, as early as possible. We should deliver only the resources we need, and we …
Continue reading “Rebuilding our tech stack for the new Facebook.com”
Photo by Steve Johnson on Unsplash A map is one of the most frequently used data structures in daily programming. It keeps key-value pairs that can easily be accessed by their keys. In JavaScript, it is quite convenient to just use a plain object for that purpose. But there is a built-in data structure in …
Continue reading “Stop Using Objects as Hash Maps in JavaScript”