Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Future of Preprocessors
Search
Roy Tomeij
June 14, 2016
Technology
0
150
Future of Preprocessors
Smashing Conference NYC 2016
Roy Tomeij
June 14, 2016
Tweet
Share
More Decks by Roy Tomeij
See All by Roy Tomeij
Empathy through Acting
roy
1
110
What (Not) to Do
roy
0
87
You and the Big Stage
roy
0
59
Make Them Click
roy
0
270
0 to 80 in 40 Minutes
roy
2
230
The Future of CSS Isn't CSS
roy
5
1.1k
Sass: With Great Power Comes Great Responsibility
roy
0
370
Front-End: Fun, Not Frustration
roy
1
1k
Sass in the Real World
roy
2
510
Other Decks in Technology
See All in Technology
日経電子版 for Android の技術的課題と取り組み(令和最新版)/android-20250423
nikkei_engineer_recruiting
0
330
Goの組織でバックエンドTypeScriptを採用してどうだったか / How was adopting backend TypeScript in a Golang company
kaminashi
6
5.8k
MCPを活用した検索システムの作り方/How to implement search systems with MCP #catalks
quiver
12
6.6k
クラウド開発環境Cloud Workstationsの紹介
yunosukey
0
170
React ABC Questions
hirotomoyamada
0
170
AI AgentOps LT大会(2025/04/16) Algomatic伊藤発表資料
kosukeito
0
140
SREからゼロイチプロダクト開発へ ー越境する打席の立ち方と期待への応え方ー / Product Engineering Night #8
itkq
2
800
CBになったのでEKSのこともっと知ってもらいたい!
daitak
1
160
AIと開発者の共創: エージェント時代におけるAIフレンドリーなDevOpsの実践
bicstone
1
310
4/17/25 - CIJUG - Java Meets AI: Build LLM-Powered Apps with LangChain4j (part 2)
edeandrea
PRO
0
110
CodePipelineのアクション統合から学ぶAWS CDKの抽象化技術 / codepipeline-actions-cdk-abstraction
gotok365
5
160
[2025年4月版] Databricks Academy ラボ環境 利用開始手順 / Databricks Academy Labs Onboarding
databricksjapan
0
140
Featured
See All Featured
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
120k
Fireside Chat
paigeccino
37
3.4k
KATA
mclloyd
29
14k
The Invisible Side of Design
smashingmag
299
50k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
227
22k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
60k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
12k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
What's in a price? How to price your products and services
michaelherold
245
12k
Build The Right Thing And Hit Your Dates
maggiecrowley
35
2.6k
It's Worth the Effort
3n
184
28k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
30k
Transcript
The Future of Preprocessors
@Roy
None
None
2 0 0 6
None
None
None
0607080910111213141516
0607080910111213141516 Made CSS Great Again
0607080910111213141516
0607080910111213141516
0607080910111213141516
0607080910111213141516
0607080910111213141516
0607080910111213141516
how about css features?
0607080910111213141516 CSS Animations Proposed
0607080910111213141516 CSS Animations -webkit- in Chrome
0607080910111213141516 CSS Animations in Internet Explorer
0607080910111213141516 CSS Animations without -webkit-
0607080910111213141516 CSS Animations still Working Draft
why so long?
None
Idea
Write Editor's Draft
Browsers may experiment with implementing
Write Working Draft
Browsers start implementing
Candidate Recommendation
Two correct, independent implementations
Recommendation
None
Idea
Natalie approves
It's implemented
Works in all browsers
Sass gave us the featureS we needeD. Fast.
CSS is catching up
calc(100% - 80px)
Custom Properties
None
Sass > CSS CSS > Sass
#languagedesign
@if media(...) { ... }
No more preprocessors
Variables, nesting, placeholders, extend, mixins, functions, control structures, lists/maps, math,
...
Programming in your CSS
CSS is a machine language
Creativity > Repetition
Configuration > Search & replace
Fun > Frustration
Sass is great for non-developers too
Don't overdo it
The following code was copy & pasted by trained monkeys.
Do not try this at home.
None