Replicache
Websites as full applications are nothing new, but theyâve kinda been smoke and mirrors (progress bars and spinners) to give you the feeling that something is happening while your transaction is taking place remotely. Adding an optimistic UI on top of that was usually its own investment, with the technicality of the project increasing as you take into account different outcomes like errors, partial successes, UI rollbacks, etc.
Replicache aims to ease the difficulty in creating good web apps by providing fast local updates which synchronize with a server. Treating the user interactions as a series of events which queue and get played on a server makes the technology also great at collaboration. Iâd check it out and peek around their docs!
Every Layout
Every once in a while I come along an article which expertly (with diagrams) explains the fundamental aspects of a domain. The Box Model is something I too frequently must explain to other developers I work with and reaching for Mozilla Developer Networks can feel a bit too sassy (RTFM vibes).
If you donât understand how layouts are calculated, or are unsure of what makes box-sizing: content-box differ from border-box then this article is for you. If you liked the article, itâs an excerpt from Heydon Pickering and Andy Bellâs book âEvery Layout.â Buy it and tell me how it is!
https://every-layout.dev/rudiments/boxes/
No More Syntax Highlighters
Gotta be honest, I canât tell you the difference between .woff, .ttf, or otf font formats. I actually have no idea how fonts work at all or how they render onto a screen. But doesnât stop me from reading cool articles about fonts!
Syntax highlighting in browsers usually is done by tokenizing the plaintext, wrapping said tokens in their own markup and giving them distinct colors based on the themes. Sounds easy right? Well looking at the library highlight.js the size of the library comes out to around 5.3MB unpacked. If you have a fully client-side rendered application like most SPAs, your user is now incurring the cost of this download to run the logic.
This article asks, what if we encoded that information into the font directly?
https://blog.glyphdrawing.club/font-with-built-in-syntax-highlighting/