

Scalability

A Scalable CSS Reading List

一系列要阅读或观察的内容，以解决这两个问题：什么是可扩展的CSS？和我们如何创建可扩展的CSS？

通过可扩展的CSS ，我的意思是CSS - 随着项目的不断发展，能够保持有效，连贯，可扩展和可维护的能力 - 能够以一致，系统的方式被任何数量的不同的人理解和工作

包括阐明关键原则和实践的资源. 该列表仅限于我认为最重要*的文章 - 也就是说，对于问题的不同方法，最好的解释（我知道）.

如果您知道应该添加的资源，请分享！ 提出问题或拉取请求.

（还有很多与CSS相关的其他问题：了解它的工作原理，使用特定属性，完成特定样式，实现响应式设计，提升性能等.此列表主要关注创建可扩展CSS的问题.）

没有任何部分提供任何类型的“排名”或“建议的阅读顺序”. 只需阅读所有内容.

Articles

最新，顶部最旧. （美国境外的一张便条：我的日期是月/日/年格式.）

• 8 rules for a robust, scalable CSS architecture，作者：Jarno Rantanen（10/16/2016）
• More Meaningful CSS，作者：Jonathan Snook（5/17/16）
• CSS and Scalability，Adam Morse（3/24/16）
• Can CSS Be Too Modular?，作者：Harry Roberts（⅜/15）
• Side Effects in CSS，Philip Walton（3/3/15）
• Used and Abused -- CSS Inheritance and Our Misuse of the Cascade，作者：Micah Godbolt（2014年8月25日）
• Enduring CSS: writing style sheets for rapidly changing, long-lived projects，作者Ben Frain（8/7/14）
• Challenging CSS Best Practices - 建议作者称之为Atomic CSS的独特方法（所有实用程序类） - 作者：Thierry Koblentz（10/21/13）
• Atomic Design 由Brad Frost（2013年10月6日） - 这与 CSS代码完全无关; 但是很多人发现它是考虑前端组件架构的一种有价值的方式，它很适合这个列表.
• MindBEMding - getting your head around BEM syntax，作者：Harry Roberts（1/25/13）
• CSS Architecture，Philip Walton（11/16/12）
• SOLID CSS，作者：Miller Medeiros（9/10/12）
• Shoot to kill: CSS selector intent，作者：Harry Roberts（7/17/12）
• The open/closed principle applied to CSS，作者：Harry Roberts（6/21/12）
• Keep your CSS selectors short，作者：Harry Roberts（5/15/12）
• The single responsibility principle applied to CSS，作者：Harry Roberts（4/28/12）
• About HTML semantics and frontend architecture，作者：Nicolas Gallagher（3/15/12）
• An Introduction to Object Oriented CSS (OOCSS)，Louis Lazaris（12/12/11）

Authoring Frameworks & Longer Readings

• Atomic CSS ，雅虎！ 公司
• CSS Modules，Glen Maddern
• CSS Guidelines，哈利罗伯茨
• Scalable and Modular Architecture for CSS，乔纳森斯诺克
• SUIT CSS Documentation，由尼古拉斯加拉格尔
• Multilayer CSS，罗伯特哈里托诺夫
• Object Oriented CSS Wiki 作者：Nicole Sullivan

CSS Styleguides

这些样式指南阐明了编写可伸缩CSS的约定和指南.

（我将 styleguides 与我称之为模式库的区别开来，模式库是为了记录和示例现有样式而不是样式创作指南而创建的引用.其他人经常使用术语 styleguide *来引用我认为模式库不太具体地关于可扩展的CSS，更多的是关于可扩展的前端设计和开发工作流;所以我不包括与模式库相关的资源.）

• Trello
• Bootstrap
• SUIT
• Github
• Medium
• Google

Workflow Overviews

>我们如何在[空白]做CSS ...

文章提供了生产网站和大规模应用程序的现实CSS方法概述. 虽然这些文章通常不包括在文章中没有更好地解释的原则和上面的更长的内容，但它们是如此务实和具体，以至于它们本身就是重要的读物. 新的先来.

• Refining the Way We Structure Our CSS at Trello，由鲍比格雷斯（11/11/14）
• How we do CSS at Ghost，保罗戴维斯（11/4/14）
• Medium's CSS is actually pretty f***ing good，Jacob Thornton（2014年8月28日）
• Codepen's CSS，Chris Coyier（2014年7月30日）
• CSS at Lonely Planet，作者：Ian Feather（2014年7月24日）
• Github's CSS，作者Mark Otto（2014年7月23日）

Talks

我认为最新的第一个.

• Atomic CSS (Slides），Thierry Koblentz（2015）
• Managing CSS Projects with ITCSS，Harry Roberts（2014）
• React: CSS in JS，Christopher Chedeau，又名Vjeux（2014）
• Thinking Beyond "Scalable CSS"，Nicolas Gallagher（2014）
• Adaptation and Components (slides），Nicolas Gallagher（2014）
• CSS is a Mess，Jonathan Snook（2013）
• Architecting Scalable CSS (slides），Harry Roberts（2013）
• CSS for Grownups (slides），Andy Hume（2013）
• CSS module system in Google+ (slides），Shubhie Panicker（2013）
• Object-Oriented CSS (slides），Nicole Sullivan（2009）