Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Future of Preprocessors

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

Future of Preprocessors

Smashing Conference NYC 2016

Avatar for Roy Tomeij

Roy Tomeij

June 14, 2016
Tweet

More Decks by Roy Tomeij

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

Other Decks in Technology

See All in Technology
まだ間に合う！ Agentic AI on AWSの現在地をやさしく一挙おさらい
Avatar for みのるん minorun365
17
2.8k
Oracle Database@Azure：サービス概要のご紹介
Avatar for oracle4engineer oracle4engineer
PRO
2
200
MySQLのSpatial(GIS)機能をもっと充実させたい ～ MyNA望年会2025LT
Avatar for sakaik sakaik
0
130
LayerX QA Night#1
Avatar for koyaman2 koyaman2
0
270
2025年のデザインシステムとAI 活用を振り返る
Avatar for Tech Leverages leveragestech
0
340
20251218_AIを活用した開発生産性向上の全社的な取り組みの進め方について / How to proceed with company-wide initiatives to improve development productivity using AI
Avatar for yayoi_dd yayoi_dd
0
720
Agent Skillsがハーネスの垣根を超える日
Avatar for Gota gotalab555
6
4.5k
ESXi のAIOps だ！2025冬
Avatar for Unno Wataru unnowataru
0
390
_第4回__AIxIoTビジネス共創ラボ紹介資料_20251203.pdf
Avatar for AIxIoTビジネス共創ラボ iotcomjpadmin
0
140
Cloud WAN MCP Serverから考える新しいネットワーク運用 / 20251228 Masaki Okuda
Avatar for SHIFT EVOLVE shift_evolve
PRO
0
100
オープンソースKeycloakのMCP認可サーバの仕様の対応状況 / 20251219 OpenID BizDay #18 LT Keycloak
Avatar for OpenID Foundation Japan oidfj
0
190
Agentic AIが変革するAWSの開発・運用・セキュリティ ～Frontier Agentsを試してみた～ / Agentic AI transforms AWS development, operations, and security I tried Frontier Agents
Avatar for Yuji Oshima yuj1osm
0
100

Featured

See All Featured
Primal Persuasion: How to Engage the Brain for Learning That Lasts
Avatar for Mike Taylor tmiket
0
190
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
50
14k
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
17k
Imperfection Machines: The Place of Print at Facebook
Avatar for Scott Boms scottboms
269
13k
So, you think you're a good person
Avatar for Per Axbom axbom
PRO
0
1.8k
Mozcon NYC 2025: Stop Losing SEO Traffic
Avatar for Sam Torres samtorres
0
98
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
355
21k
Visualization
Avatar for Eitan Lees eitanlees
150
16k
Build your cross-platform service in a week with App Engine
Avatar for Jose L jlugia
234
18k
JAMstack: Web Apps at Ludicrous Speed - All Things Open 2022
Avatar for David Neal reverentgeek
1
300
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
22k
Design in an AI World
Avatar for tapps tapps
0
100

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