CSS Blocks - The Frontend Devs' New Best Friend

Posted on April 26, 2018

reading time

LinkedIn have recently released a new tool for frontend developers everywhere, called CSS Blocks.

CSS Blocks promises to be easier to maintain, quicker to compile (presumably than standard SASS/Scss), but also helps you write less code.

In larger applications having a single stylesheet is often unrealistic or creates a large overhead.  Because of this plenty of developers opt for dynamic stylesheets, or a myriad of stylesheets that are loaded based on the components on the given page.  That's great, but brings about its own problems such as:

  • Very difficult to maintain in some instances
  • Often code is repeated in various places for various components
  • There are often overrides for different components in different scenarios, which gets messy quickly

CSS Blocks aims to solve all that.  Additionally, CSS Blocks ships with a new product called OptiCSS, which optimises your CSS selectors.

But why, you ask?  Well, CSS selectors are quick already, especially in modern browsers.  However, in a stylesheet with potentially tens of thousands of rules there is always going to be room for improvement, which leaves you with time to spend on more important parts of your application.

css-at-scale-3.jpg#asset:13


Read more over on GitHub.