Home / Companies / LogRocket / Blog / Post Details
Content Deep Dive

Compiled: A CSS-in-JS library without the runtime cost

Blog post from LogRocket

Post Details
Company
Date Published
Author
Nathan Sebhastian
Word Count
1,047
Company Posts That Month
62
Language
-
Hacker News Points
-
Post removed?
No
Summary

CSS-in-JS is a design pattern that addresses challenges in scaling CSS by using JavaScript modules for smaller file separation and unique local naming for scoping. However, this approach can lead to increased loading times as modern UI libraries like React rely on JavaScript bundles, which can grow significantly. Compiled, a library developed by Atlassian Labs, offers a solution by analyzing code at build time and transforming it into components that do not generate CSS at runtime, thus resolving performance issues associated with dynamic CSS generation. It mimics styling patterns from libraries like styled-components and Emotion and allows seamless integration without additional configuration. To use Compiled with React, developers need to install specific packages and plugins for Babel or TypeScript compilers, ensuring efficient styling without runtime costs.

Trends Found in this Post
Trend Post Mentions Total Month Mentions Posts Companies MoM
Developer Experience 3 103 51 32 +41%
Use This Data

Use this post, company, and trend context to find content marketing opportunities, perform competitive analysis, or address product feature gaps via the Plushcap MCP server or the Plushcap API.