Blog posts

Useful Npx Packages for the Developer's Everyday Life

Npm comes with a neat tool called npx that lets you directly execute packages from the npm registry. It temporarily downloads it behind the scene and won’t pollute your local or global npm environment. In this post I’ll skip useful packages that are bound to libraries and frameworks like Angular’s ng, react’s create-react-app or capacitor’s cap. I focus on packages that have helped me through my daily life as a developer.

Time to Say Goodbye to Google Fonts: Cache Performance

I’ve used Google Fonts in prototypes and in 10M+ MAU products. It’s incredibly easy to get started with and provides an amazing font discovery. That’s also why it’s currently still used on over 42M websites! This convenience has its price: Performance. Many have already pointed out the cost of multiple requests. If you want the remaining speed boost, then you’re best off downloading your used Google Fonts and self-host them.

My Top 5 Book Recommendations

I love reading books—I read through 1-4 books a month. That wasn’t always the case. If you saw my home just two years ago you wouldn’t have found any books. Back then I read a few blog posts online and that was it. I never felt the need to read pieces of paper bundled together. …Until I tried it. I first tried it with a book called Factfulness by Hans Rosling.

Stats and Learnings from Finishing #11 on Product Hunt

I launched Notyfy on Product Hunt on 7th of May. My first Product Hunt Launch 🎉—a lot of time went into the preparation together with my friend Peter 👋. Read on to see what stats and learnings finishing #11 on Product Hunt brings. Notyfy Let me quickly run you through what the product is that I launched on Product Hunt: Notyfy is a browser extension that aggregates web notifications from Twitter, Reddit, Facebook and many more in one place.

"Hybrid Apps are slow"

…and other things I’ve heard regarding Hybrid App development. Let’s talk about the elephant in the room: Performance. Let me just show you how fast and smooth Hybrid apps can be based on this footage of my last work: JustWatch, a streaming search engine with 12M monthly active users. It’s been recorded on a OnePlus 6 (May 2018). “Hybrid Apps will never be faster than native” Yes, this is true.

Using Firebase with webpack? You might be able to save 220kb

MARCH 2020 UPDATE: The new Firebase JS SDK Alpha makes your bundle up to 80% smaller! It now fully adopts tree-shaking and lets you import only what you truly need. In a lot of tutorials I came across the comfortable solution of just adding import * as firebase from ‘firebase’ for your firebase import. As it turns out, there are 4 modular packages for Firebase. Here they are along with their sizes:

Add ES7 Async/Await Support for your Webapp in 3 Easy Steps

Nearly all evergreen browsers support Async/Await natively Async/Await has been around the block already some time. Now that it is in stage-4 since July 2016 (stage finished in the ECMAScript proposals) and nearly all evergreen browsers support it natively, too (except IE is late to the party as usual 😪) — it’s definitely time to take a second look. TL;DR I WANT ASYNC/AWAIT SUPPORT NAO!!1 use babel-preset-env yarn add regenerator or npm install regenerator add node_modules/regenerator-runtime/runtime.

PWA: Create a "New Update Available" Notification using Service Workers

New Update available popup. PWAs are getting more and more coverage and support. They improve the web experience and can load your app instantly with their great ability for HTTP caching (among other things, but this post only covers caching). The thing with Offline-First is, that you cache all the resources that are needed for launching up the webapp — even your index.html! Note: No sweat!

iOS & Android Native Build Errors with Cordova Plugins

Lately I encountered some native build errors that slowed me down quite a bit. Here is an overview of some of them, their issue and solution which might save you some time if you come across one of the following native errors: iOS: ‘GoogleCloudMessaging.h’ file not found iOS: Duplicate Symbols Android: safeparcel.AbstractSafeParcelable not found Android: Force Close due to phonegap-push-plugin iOS: ‘GoogleCloudMessaging.h’ file not found error: ‘GoogleCloudMessaging.

Angular’s ng-repeat Finish Event

Demo,js,output Explanation Sometimes you need to execute code after your list has been rendered on the client side. // js angular.module('ngRepeatDemo', []) .controller('AppCtrl', function() { var vm = this; vm.alphabet = [ 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z' ]; vm.finished = function() { alert('fired'); // now javascript execution has been stopped and you should see all DOM nodes been created // note: interpolation may not have been done completely }; }); <!