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
580

Other Decks in Programming

See All in Programming
Spring Security 実践 ─ GraphQL APIで実務に役立つ 認証・認可 を学ぶ
Avatar for Wagyu wagyu
0
260
生成AI時代にこそ効くGo | Why Go Works in the Age of Generative AI
Avatar for mom0tomo mom0tomo
8
3.3k
「なぜそう決めたのか」を残し続ける仕組み ― Notion AI カスタムエージェント × Slack連携による設計判断の自動記録 - NIKKEI Tech Talk #47
Avatar for ニフティ株式会社 niftycorp
PRO
0
230
並列実装の現場、2ヶ月間実務でAIを使い倒したAIもPCも私も限界が近い
Avatar for ming ming_ayami
0
130
The NotImplementedError Problem in Ruby
Avatar for Koichi ITO koic
1
920
Datadog × OpenTelemetry 入門と実践のあいだ
Avatar for Max Kento kn_to_maxpno
1
170
Webフレームワークの ベンチマークについて
Avatar for Yusuke Wada yusukebe
0
180
Language Server 使ってる？ 〜VSCode と Zed の場合〜 / Are you using a Language Server? ~For VS Code and Zed~
Avatar for NAGATA Hiroaki handlename
0
800
メソッドのジェネリクスでGoの夢は広がるか？ / Kyoto.go #65
Avatar for utagawa kiki utgwkk
3
920
さぁV100、メモリをお食べ・・・
Avatar for nilpe nilpe
0
150
才能？センス？知らん、 続けたもん勝ちだ。-- 結婚・出産・癌を越えてなお、私がプロダクトを創り続ける理由
Avatar for 16bit_idol 16bitidol
1
100
ふつうのFeature Flag実践入門
Avatar for irof irof
8
4.2k

Featured

See All Featured
What does AI have to do with Human Rights?
Avatar for Per Axbom axbom
PRO
1
2.2k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.7k
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
Avatar for Mine Cetinkaya-Rundel minecr
1
300
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
51
52k
Building Applications with DynamoDB
Avatar for Matt Wood mza
96
7.1k
AI in Enterprises - Java and Open Source to the Rescue
Avatar for ivargrimstad ivargrimstad
0
1.3k
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
174
15k
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
275
41k
Heart Work Chapter 1 - Part 1
Avatar for Lake Fama lfama
PRO
7
36k
Everyday Curiosity
Avatar for Cassini Nazir cassininazir
0
240
What Being in a Rock Band Can Teach Us About Real World SEO
Avatar for Ade Holder 427marketing
0
1k
HU Berlin: Industrial-Strength Natural Language Processing with spaCy and Prodigy
Avatar for Ines Montani inesmontani
PRO
0
410

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