2016 年仅仅是三年前,但在网页开发领域,这几乎是一个完全不同的时代。 JavaScript 的发展格局动荡不安,新兴的 React 以及一个鲜为人知的框架 Vue 正在努力取代 Angular 的地位。
像许多其他开发者一样,我感到迷茫。 我需要一些清晰的思路,我认为获得这些思路的最佳方法就是简单地询问其他程序员他们使用了什么,更重要的是,他们喜欢使用什么。 结果是首届如今已成为年度活动的 JavaScript 现状调查。

从那时起,JavaScript 世界已经稳定下来。 事实证明,你使用这三大框架中的任何一个都不会出错,甚至像 Ember 这样不太主流的选项也成功地建立了充满激情的社区,并且没有显示出任何消亡的迹象。
但是,当我们所有人的注意力都集中在 JavaScript 上时,CSS 领域却暗藏危机。 多年来,我对 CSS 发展的印象是缓慢的、渐进的进步。 那时候,我非常确定border-radius
的支持代表了网页浏览器技术的最终辉煌成就。
但突然之间,情况开始发生变化。 Flexbox 诞生了,这是十多年来第一个新的并且被广泛采用的布局方法。 随后,Grid 迅速出现,将多年的笨拙网格框架扫入了糟糕 CSS 实践的垃圾堆。
更疯狂的事情发生了:现在 JavaScript 开发人员每两周不再创建新的框架了,他们决定利用所有额外的空闲时间来改进 CSS! 于是,CSS-in-JS 诞生了。
现在是 2019 年,我过去两年一直保持打开状态的 Flexbox 速查表 选项卡现在加入了 Grid 速查表,因为无论我使用它们多少次,我仍然需要仔细检查语法。 尽管我写过 一篇关于 CSS-in-JS 的热门介绍文章,但我仍然懒惰地在新项目中默认使用熟悉的 Sass,并承诺自己下次会“正确地做事”。
总而言之,我感觉 2019 年我对 CSS 的迷茫和困惑程度与 2016 年我对 JavaScript 的迷茫和困惑程度一样。 是时候让 CSS 有自己的调查了。
从头开始
想到进行 CSS 调查的想法很容易,但是决定调查问题本身却远非易事。 正如我所说,我对自己的 CSS 知识没有信心,仅仅第 37 次询问 Sass 与 Less 的比较感觉像是错失良机……
幸运的是,CSS 之神决定对我微笑:在参加法国的 DotJS 大会 时,我发现,不仅我的同事演讲者 Florian Rivoal 和我一样住在日本京都;而且他还是 CSS 工作组的成员! 换句话说,地球上最了解 CSS 的人之一就住在离我几个火车站的地方!
Florian 在制定调查的整体结构和内容方面提供了巨大的帮助。 他还帮助我意识到我对 CSS 的了解有多么少。

你并不了解 CSS
我在这里说的不仅是晦涩的 CSS 属性,甚至不是新兴的 CSS 属性,而是关于 CSS本身是如何开发的。 例如,你知道 CSS Grid 规范的开发是由彭博社赞助的,因为他们需要一种方法将他们著名的终端布局移植到网页上吗?
你有没有想过在圆形屏幕(例如 智能手表上的屏幕)上,top: 30px
应该是什么意思? 或者你知道有些人正在用 CSS 布局整个印刷书籍,有效地取代了 InDesign 等软件吗?
与 Florian 的交谈真正扩展了我对 CSS 的广度和趣味性的认识,并说服我进行这项调查是值得的。

关于这种分歧……
随着我对 CSS 的新发现的欣赏似乎与一种普遍的情绪相吻合,即在 JavaScript 霸权面前,HTML 和 CSS 掌握正在成为被低估的技能,CSS 调查的想法变得越来越重要。
我个人一直喜欢成为一名通才,因为我乐于在 鸿沟的两侧之间跳跃,只要我愿意。 同时,我完全相信世界需要像 Florian 这样的专家;那些将自己的一生奉献给网页某个特定方面,并致力于维护和改进它的人。
贬低通才的工作不仅不公平,而且适得其反——毕竟,HTML 和 CSS 是所有现代 JavaScript 框架的基础;另一方面,CSS-in-JS 库开创的新模式和方法有望迟早回归到原生 CSS 中。
幸运的是,我感觉只有少数开发者持有这些观点,而持有这些观点的人通常是出于对“另一方”真正代表什么的无知,而不是任何有根据的意见。
所以调查就派上用场了:我并不是说我能够填补鸿沟,但也许我可以架设几条通道,或者分发一些喷气背包——你知道,任何有效的方法都可以。 🚀
如果这听起来不错,那么第一步就是——你猜对了——参与调查!
“CSS 调查的想法变得越来越重要,因为我对 CSS 的新发现的欣赏似乎与一种普遍的情绪相吻合,即在 JavaScript 霸权面前,HTML 和 CSS 掌握正在成为被低估的技能。”
我喜欢这一部分
在多年的前端开发之后,我现在通常从事后端开发,最近被卷入了一个前端项目。 我立刻惊叹于 CSS 竟然发生了变化! 从什么时候开始我们被允许使用这种 Flex 废话? 我去 caniuse 查看,它说我可以使用这些东西! 这是什么时候发生的?
在我那个时代,我们只有浮动,当事情出错时,我们会使用 border: 1px solid red,而且我们对此心怀感激!
所以感谢你发表这篇文章。 它提醒我们,在任何领域,你都可以挑战任何专家,你仍然会发现一些人正在摸索前进,只是由于多年的经验积累,他们的水平略高一些,并且永远不要停止学习;)