Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Future of Preprocessors

Avatar for Roy Tomeij Roy Tomeij
June 14, 2016
Technology
200
0

Future of Preprocessors

Smashing Conference NYC 2016

Avatar for Roy Tomeij

Roy Tomeij

June 14, 2016

More Decks by Roy Tomeij

See All by Roy Tomeij
Empathy through Acting
Avatar for Roy Tomeij roy
1
150
What (Not) to Do
Avatar for Roy Tomeij roy
0
130
You and the Big Stage
Avatar for Roy Tomeij roy
0
110
Make Them Click
Avatar for Roy Tomeij roy
0
320
0 to 80 in 40 Minutes
Avatar for Roy Tomeij roy
2
300
The Future of CSS Isn't CSS
Avatar for Roy Tomeij roy
5
1.2k
Sass: With Great Power Comes Great Responsibility
Avatar for Roy Tomeij roy
0
450
Front-End: Fun, Not Frustration
Avatar for Roy Tomeij roy
1
1.1k
Sass in the Real World
Avatar for Roy Tomeij roy
2
540

Other Decks in Technology

See All in Technology
AIがGISを代替する日：〜すべてをAIが創る時代に、私たちがFOSS4Gに関わる意味〜
Avatar for Yuji Kobayashi lehupa
1
210
AIコーディングはじめました
Avatar for 田中みそ miso
0
160
会社説明資料_最新版
Avatar for 株式会社出前館 demaecan
0
32k
[General] 개발자로 해외 기업에서 일하기
Avatar for Jaewoong skydoves
1
310
分析作業をどこまで任せるか自分で決められる
AIネイティブBI『Golden Analytics』が
良さげな話 /golden-analytics-is-ai-native-bi
Avatar for shinyaa31 shinyaa31
0
130
Gifu WordPress Meetup #200 に向けて、私たちには何ができるだろうか？/ 2026-11-07 Gifu WordPress Meetup
Avatar for Toro_Unit (Hiroshi Urabe) torounit
0
230
Reticulum, le réseau cypherpunk dont vous avez besoin !
Avatar for Renaud Lifchitz rlifchitz
0
110
PostgreSQL オプティマイザ統計の秘密
Avatar for Noriyoshi Shinoda nori_shinoda
0
420
業務でAWSをあまり使っていない私が、AWSへのモチベを保つ方法
Avatar for Makky12 smt7174
0
180
evcc & Home Assistant
Avatar for Michael Geers naltatis
0
260
AI時代に求められる優秀なTechLeadの振る舞い
Avatar for pospome pospome
11
15k
bpf_arenaとstruct_opsを使うのが難しかった話
Avatar for KANAI Masumi masu_mi
0
210

Featured

See All Featured
How to Talk to Developers About Accessibility
Avatar for Jason CranfordTeague jct
2
620
Code Review Best Practice
Avatar for Trisha Gee trishagee
74
20k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
247
13k
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
PRO
92
590k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
163
24k
Accessibility Awareness
Avatar for Sarah Abderemane sabderemane
1
290
Measuring Dark Social's Impact On Conversion and Attribution
Avatar for Stephen Akadiri stephenakadiri
2
320
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
Avatar for Joe Casabona jcasabona
35
2.9k
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.6k
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
Avatar for Ines Montani inesmontani
PRO
3
2.5k
Highjacked: Video Game Concept Design
Avatar for Ryan Kendrick rkendrick25
PRO
1
550
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
275
41k

Transcript

  1. The Future of Preprocessors

  2. @Roy

  3. None
  4. None

  5. 2 0 0 6

  6. None
  7. None
  8. None

  9. 0607080910111213141516

  10. 0607080910111213141516 Made CSS Great Again

  11. 0607080910111213141516

  12. 0607080910111213141516

  13. 0607080910111213141516

  14. 0607080910111213141516

  15. 0607080910111213141516

  16. 0607080910111213141516

  17. how about css features?

  18. 0607080910111213141516 CSS Animations Proposed

  19. 0607080910111213141516 CSS Animations -webkit- in Chrome

  20. 0607080910111213141516 CSS Animations in Internet Explorer

  21. 0607080910111213141516 CSS Animations without -webkit-

  22. 0607080910111213141516 CSS Animations still Working Draft

  23. why so long?

  24. None

  25. Idea

  26. Write Editor's Draft

  27. Browsers may experiment with implementing

  28. Write Working Draft

  29. Browsers start implementing

  30. Candidate Recommendation

  31. Two correct, independent implementations

  32. Recommendation

  33. None

  34. Idea

  35. Natalie approves

  36. It's implemented

  37. Works in all browsers

  38. Sass gave us the featureS we needeD. Fast.

  39. CSS is catching up

  40. calc(100% - 80px)

  41. Custom Properties

  42. None

  43. Sass > CSS CSS > Sass

  44. #languagedesign

  45. @if media(...) { ... }

  46. No more preprocessors

  47. Variables, nesting, placeholders, extend, mixins, functions, control structures, lists/maps, math,

    ...

  48. Programming in your CSS

  49. CSS is a machine language

  50. Creativity > Repetition

  51. Configuration > Search & replace

  52. Fun > Frustration

  53. Sass is great for non-developers too

  54. Don't overdo it

  55. The following code was copy & pasted by trained monkeys.

    Do not try this at home.
  56. None