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

KonMariCSS

Avatar for Vince Vince
November 26, 2017
Programming
96
0

 KonMariCSS

How to Tidy Your Space and Change Your Life

Avatar for Vince

Vince

November 26, 2017

More Decks by Vince

See All by Vince
Patterns, Language, and the tale of the Million Dollar Button
Avatar for Vince snailbites
1
570

Other Decks in Programming

See All in Programming
TAKTでAI駆動開発の品質を設計する
Avatar for かとじゅん j5ik2o
4
280
作って学ぶ、 JSX (TSX) ランタイムの基本
Avatar for syumai syumai
7
1.5k
脅威をエンジニアリングの糧にして――現場編 / Turning Threats into Engineering Fuel — Field Edition
Avatar for nrs nrslib
0
240
Modding RubyKaigi for Myself
Avatar for yui-knk yui_knk
0
860
開発体験を左右するライブラリの API 設計 - GraphQL スキーマ構築ライブラリから考える #tskaigi
Avatar for izumin5210 izumin5210
2
1.5k
Swiftのレキシカルスコープ管理
Avatar for kntk kntkymt
0
210
Technical Debt: Understanding it Rightly, Engaging it Rightly #LaravelLiveJP
Avatar for shogogg shogogg
0
190
Make SRE Operations Easier with Azure SRE Agent
Avatar for KAMEGAWA Kazushi kkamegawa
0
3.1k
Lemonade + Foundry Toolkit でお手軽アプリ開発
Avatar for 瀬尾佳隆 seosoft
1
270
OCRを使ってゲームのアイテムをデータ化する
Avatar for Kishikawa Katsumi kishikawakatsumi
0
130
Stage 3 Decorators でできること / できないこと / TSKaigi 2026
Avatar for Susisu susisu
1
1.5k
dRuby over BLE
Avatar for makicamel makicamel
2
290

Featured

See All Featured
Designing for humans not robots
Avatar for Tammie Lister tammielis
254
26k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
150
How Fast Is Fast Enough? [PerfNow 2025]
Avatar for Tammy Everts tammyeverts
3
600
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
49
10k
Navigating the moral maze — ethical principles for Al-driven product design
Avatar for Skipper Chong Warson skipperchong
2
380
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
8.2k
Design in an AI World
Avatar for tapps tapps
1
220
Skip the Path - Find Your Career Trail
Avatar for Mark Kilby mkilby
1
140
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
659
62k
How to Talk to Developers About Accessibility
Avatar for Jason CranfordTeague jct
2
220
Done Done
Avatar for chrislema chrislema
186
16k
Lightning Talk: Beautiful Slides for Beginners
Avatar for Ines Montani inesmontani
PRO
2
570

Transcript

  1. KonMari CSS How to Tidy Your Space and Change Your

    Life*

  2. Vincent Nalupta Senior Software Engineer @snailbites

  3. HUNGRY + ANGRY = HANGRY

  4. First, some context...

  5. None
  6. None
  7. None
  8. None

  9. ¯\_(ツ)_/¯

  10. The KonMari Cleaning Method

  11. KonMari CSS How to Tidy Your Space and Change Your

    Life*

  12. ANALYZE PLAN REFACTOR OPTIMIZE

  13. ANALYZE PLAN REFACTOR OPTIMIZE

  14. “Place every piece of clothing in the house on the

    floor.”

  15. File size Selector count Maintainability Load times

  16. cssstats.com

  17. None

  18. 360 KB (76KB minified gzipped)

  19. "Before you start, visualize the destination"

  20. ANALYZE PLAN REFACTOR OPTIMIZE

  21. Identify your goals

  22. 1 month 3 months 1 year

  23. What problems are you trying to solve?

  24. Settle on a naming convention

  25. .parent <section class=”parent”> </section> -child <div class=”parent-child”> </div> -gchild <p

    class=”parent-child-gchild”> ... </p>

  26. .box--delivery .box--pickup

  27. None

  28. UI Testing

  29. https://github.com/webdriverio/webdrivercss

  30. "The moment you start, you reset your life."

  31. ANALYZE PLAN REFACTOR OPTIMIZE

  32. Refactor a single file “Code as Craft”

  33. None
  34. None

  35. Break

  36. File size Selector count Maintainability Load times

  37. ANALYZE PLAN REFACTOR OPTIMIZE

  38. Style guide driven development

  39. None

  40. Demo

  41. None

  42. Find the outliers

  43. http://bit.ly/2evMYuw

  44. End Game

  45. None

  46. Build some bridges!

  47. None

  48. @snailbites http://snailbites.com/blog/

  49. (504) 229-6828 #KonMariCSS