Enable javascript in your browser for better experience. Need to know to enable it? Go here.
Last updated : May 19, 2020
Not on the current edition
This blip is not on the current edition of the Radar. If it was on one of the last few editions it is likely that it is still relevant. If the blip is older it might no longer be relevant and our assessment might be different today. Unfortunately, we simply don't have the bandwidth to continuously review blips from previous editions of the Radar Understand more
May 2020
试验 ? 值得一试。了解为何要构建这一能力是很重要的。企业应当在风险可控的前提下在项目中尝试应用此项技术。

自2017年,我们把 CSS-in-JS 作为新兴技术提出后,它变得越来越流行了,在我们的工作中也可以看到明显的趋势。基于一些扎实的生产经验,我们现在推荐 CSS-in-JS 为试用技术。在上次的技术雷达中我们提到过,要了解这个技术, 样式化组件 框架是一个很好的出发点。在使用 CSS-in-JS 技术的时候,除了它的种种优点,通常也会遭遇到一个缺点:运行时计算样式会导致 用户可感知延迟。通过 Linaria, 我们看到了一类新的在创建时就考虑到这个问题的框架。Linaria 引入了许多技术把大部分性能开销转移到构建时间。不过这也带来了一些妥协,最常见的就是不支持 IE11 的动态样式。

Nov 2017
评估 ? 在了解它将对你的企业产生什么影响的前提下值得探索

CSS in JS is a technique of writing CSS styling in the JavaScript programming language. This encourages a common pattern of writing the styling with the JavaScript component it applies to, co-locating presentational and logical concerns. The new players — including JSS, emotion and styled-components — rely on the tooling to translate the CSS-in-JS code to separate CSS stylesheets, to make them suitable for browser consumption. This is the second-generation approach to writing CSS in JavaScript and unlike the previous approaches doesn’t rely on in-line styles. That means it provides the benefit of supporting all CSS features, sharing of CSS using the npm ecosystem and utilization of components across multiple platforms. Our teams have found styled-components working well with component-based frameworks, such as React, and unit testing of CSS with jest-styled-components. This space is new and rapidly changing; the approach requires some effort for manual debugging of the generated class names in the browser, and it may not apply to some projects where the front-end architecture does not support reusing components and requires global styling.

已发布 : Nov 30, 2017


English | Español | Português | 中文