Orchard Lab

A place to share my thoughts and learnings

Re-watch Rethinking reactivity

Posted at — Feb 11, 2022

https://www.youtube.com/watch?v=AdNJ3fydeao

Wether or not you are a front end developer or even a software engineer. This talk worth your time either from a inspirational perspective on how can we create more accessible things, or from a marketing perspective, I’ve never saw a better “marketing talk” for a front end framework, watching this talk constantly reminds me of Apple or Volvo’s advertisement.

Reactivity, the easy way

Svelte is more like a language other than a framework. It’s like a modern dialect of the web, combined all three of HTML, CSS and JavaScript in one single file. The most interesting part is the compiler behind it, which tracks the “changes” of your variables. The magics lies into the assignment tracking, for example when you do foo = 42, anywhere uses foo will be evaluated thus you get the “automatic” reactivity of the interface without needing to do anything manually.

Reactivity in JavaScript land is not new, RxJS has been there for a long time. But thinking in terms of streams is quiet some learning curve or adaption for programers, while assignment is almost the first day we learned from programming 101.

Compiler

The other key part of the Svelte is the compiler. There is a trend that we are doing more and more in the back scene instead of shipping large frameworks. The compiler enables us to still write in the way that we used to, but free from the limitation of given languages, cause the compiler will help “translate” them into “low level” bits.

It enables us to think more in the human friendly way, instead of forcing us to adapting our thinking approach in the machine way.

Ultimately, it’s a decoupling and abstraction. So the compiler could improve our web app performance without us changing our existing code.

Another advantage or the compiler is to produce more optimized bundle depending on the environment. Whether it would be JavaScript script on the client side, or plain string on the server side.

All of these are the great parts, but what touched me the most is the non-technical parts.

Accessible tool

I am always fascinated about the non-technical parts for certain tools or technology, in other words, the beliefs of the creator behind the scene. One reason might be the “fear” that I have over the loved technology might change, because even though the technology or the implementation changes, the thinking or main idea behind it rarely do.

Another reason is I think ideas simply lasts longer than specific technology. Just like Dynabook did to iPads, Smalltalk did to the OOP (though Alan Kay means quite differently things) and a lot other ideas influenced and shaped Notion.

If I have to summarize what’s fundamentally different Svelte is different than other front end frameworks. It’s accessibility. Here in the context I didn’t mean the Web Accessibility though it’s super well considered and covered in Svelte already.

Here I am more talking about Svelte is more accessible to use in order to create web interactive UI. HTML is no doubt is the most accessible pillar of three web elements(HTML, CSS, JavaScript). By bringing back the focus to the HTML markup while adding interactivity is a tremendously mental reliving comparing to popular front end frameworks like React which is almost exclusively using JavaScript to create everything.

Rich mentioned his inspiration came from his wife using spreadsheets to calculate, analysis complicated business problems.

I believe tools are fundamentally intend to be used by more and more people, making it less intimidating and more accessible is the key to empower regular people. Apple succeeded not because they looks shinny and beautiful, but because they demystified “professional” tools and enables you and me to create as well.

Which reaches Rich’s last words of the talk, which I think it’s the essence of Svelte: In a strange way, it brought us all a little closer together.