Clearfix: A Lesson in Web Development Evolution

July 15, 2018 by Bramus! Leave a comment

A lesson in webdev history by Jason Hoffman:

The clearfix, for those unaware, is a CSS hack that solves a persistent bug that occurs when two floated elements are stacked next to each other. When elements are aligned this way, the parent container ends up with a height of 0, and it can easily wreak havoc on a layout. The clearfix was invented to solve all that.

But to understand the clearfix, you have to go back even further, to the 2004 and a particular technique called the Holly hack.

I had some nostalgic flashbacks whilst reading this 🙂

Clearfix: A Lesson in Web Development Evolution →

Elsewhere , , , Leave a comment

JavaScript engine fundamentals: Shapes and Inline Caches

July 15, 2018 by Bramus! Leave a comment

Mathias Bynens and Benedikt Meurer:

As a JavaScript developer, having a deeper understanding of how JavaScript engines work helps you reason about the performance characteristics of your code.

I especially like the part where they take a look into an JS engine’s Object Model:

How do JavaScript engines implement the JavaScript object model, and which tricks do they use to speed up accessing properties on JavaScript objects? As it turns out, all major engines implement this very similarly.

(knowledge of the aforementioned Property Descriptors will come in handy ;))

The contents of the article have also been touched upon in this duo-talk they gave:

JavaScript engine fundamentals: Shapes and Inline Caches →

Elsewhere , Leave a comment

A minimal guide to ECMAScript Decorators (and Property Descriptors)

July 15, 2018 by Bramus! 1 Comment

Very insightful piece by Uday Hiwarale on ES Decorators (Class Method Decorators, Class Instance Field Decorators, and Class Decorators).

Right now (June 2018), Decorators are in stage 2 and we have Babel plugin to transpile decorators babel-plugin-transform-decorators-legacy. In stage 2, as syntax of the feature is subjected to change, it’s not recommended to use it in production as of now. In any case, decorators are beautiful and very useful to achieve things quicker.

Before going into Decorators he gives a very insightful explanation about Property Descriptors first:

To understand decorators, we need to first understand what is a property descriptor of JavaScript object property.

A minimal guide to ECMAScript Decorators (and Property Descriptors) →

Elsewhere , , 1 Comment

Offline Storage: When 7 KB Equals 7 MB

July 15, 2018 by Bramus! Leave a comment

Gerardo Rodriguez from Cloudfour:

While testing a progressive web app for one of our clients, I bumped into a suspicious error in the browser console: DOMException: Quota exceeded.

After browsing the app a few more times, it became clear the error would occur after a small number of images were added to the cache storage by the service worker. Looking in the Chrome DevTools Application tab, the cache storage was indeed over capacity.

How could this be? There were only ~15 images in the cache storage. Something was off.

The culprit? Opaque Responses.

When 7 KB Equals 7 MB →

Elsewhere , , Leave a comment

How one typeface took over movie posters

July 15, 2018 by Bramus! Leave a comment

Interesting piece by Vox on the use of Trajan in movie poster design:

Elsewhere , , Leave a comment

BIO: Combining the powers of BEM, OOCSS and ITCSS for Improving CSS

June 28, 2018 by Bramus! Leave a comment

Ryan Yu:

There are many great techniques out there to improve the way we write CSS, and from my experience, I found the following three techniques that make up the BIO acronym work very well together

  • BEM
  • ITCSS
  • OOCSS

A lot of developers/engineers already know those famous techniques but I would like to go through each of them and talk about the way I use those techniques.

I can say that this combination works really well, as it is exactly the work I have done at Small Town Heroes whilst working on their Zender product.

Combining the Powers of SEM and BIO for Improving CSS →

During said project I even outperformed myself when it comes to adding comments in the code 😜

Elsewhere , Leave a comment

Why incompetent people think they’re amazing – The Dunning-Kruger effect

June 28, 2018 by Bramus! Leave a comment

I first heard of the Dunning-Kruger effect at last year’s Fronteers Conference in a talk by Jessica Rose. In that talk she said that “the unskilled aren’t aware of their lack of own skill, and are unable to assess and value others’ skills”. This is known as the Dunning-Kruger effect.

This nice video goes into more detail:

How good are you with money? What about reading people’s emotions? How healthy are you, compared to other people you know? Knowing how our skills stack up against others is useful in many ways. But psychological research suggests that we’re not very good at evaluating ourselves accurately. In fact, we frequently overestimate our own abilities. David Dunning describes the Dunning-Kruger effect.

Elsewhere , Leave a comment

Would Airbnb Have Fared Better With NativeScript Instead of React Native?

June 28, 2018 by Bramus! Leave a comment

Interesting blog post by TJ Vantoll, who works on NativeScript:

In this article we’ll walk through Airbnb’s complaints in detail, and talk about how some of those same problems could’ve been handled in NativeScript. We’ll start with things that NativeScript does well (this is the NativeScript blog after all), and then move on to things NativeScript does, well, less well.

Takes a good look at things like the bridge, the use of TypeScript, the benefits of NativeScript’s single threaded model.

Would Airbnb Have Fared Better With NativeScript Instead of React Native? →

Be sure to also read “State of React Native 2018”. In that post, Facebook announced some changes it’s going to make regarding the bridge/threading:

To make React Native more lightweight and fit better into existing native apps, this rearchitecture has three major internal changes. First, we are changing the threading model. Instead of each UI update needing to perform work on three different threads, it will be possible to call synchronously into JavaScript on any thread for high-priority updates while still keeping low-priority work off the main thread to maintain responsiveness. Second, we are incorporating async rendering capabilities into React Native to allow multiple rendering priorities and to simplify asynchronous data handling. Finally, we are simplifying our bridge to make it faster and more lightweight; direct calls between native and JavaScript are more efficient and will make it easier to build debugging tools like cross-language stack traces.

Really looking forward to these upcoming changes 🙂

Elsewhere , , , Leave a comment

JSUI – A tool for visually organizing, creating and managing JavaScript projects.

June 26, 2018 by Bramus! Leave a comment

Highly interesting tool by Kitze:

  • 🗂 Organize & group apps
  • 🤖 Generate new apps
  • 🔍 Search apps & preview files
  • 🏃‍♂️ Quick actions
  • ✅ Run scripts
  • 🗄 Manage dependencies
  • 🔌 Apply plugins
  • 📄 Generate files

This will surely help out developer starting with JavaScript based projects. More features are tweeted out regularly on JSUI’s Twitter Account.

JSUI →

Elsewhere , Leave a comment

30 seconds of PHP code

June 26, 2018 by Bramus! Leave a comment

A curated collection of useful PHP snippets that you can understand in 30 seconds or less.

These functions – like endsWith and startsWith for strings – should be part of the PHP core.

30 seconds of PHP code →

(via Freek)

Elsewhere , Leave a comment