Microstates

 Microstates

When was the last time you looked forward to state management? Our current tools work, but do they feel fun and easy? With microstates we'll see how they can be.

97b6ab7f472930954c145ea8080b5742?s=128

Charles Lowell

August 06, 2018
Tweet

Transcript

  1. @cowboyd Microstates State management that feels great

  2. @cowboyd Hi.

  3. @cowboyd @cowboyd

  4. @cowboyd https://frontside.io

  5. @cowboyd numbers can increment

  6. @cowboyd Redux

  7. @cowboyd MobX

  8. @cowboyd Unstated

  9. @cowboyd setState

  10. @cowboyd Why?

  11. @cowboyd numbers can increment

  12. @cowboyd Arrays can push

  13. @cowboyd Booleans can toggle

  14. @cowboyd What is a Boolean?

  15. @cowboyd False True toggle() toggle() set(false) set(true)

  16. @cowboyd False True toggle() toggle() set(false) set(true)

  17. @cowboyd False True toggle() toggle() set(false) set(true)

  18. @cowboyd False True toggle() toggle() set(false) set(false)

  19. @cowboyd False True toggle() toggle() set(false) set(true) set(false) set(true)

  20. @cowboyd False True toggle() toggle() set(false) set(true) set(false) set(true) Boolean

  21. @cowboyd False True toggle() toggle() set(false) set(true) set(false) set(true)

  22. @cowboyd False True toggle() toggle() set(false) set(true) set(false) set(true)

  23. @cowboyd False True toggle() toggle() set(false) set(true) set(false) set(true)

  24. @cowboyd Reinventing Very Small Wheels One very small wheel at

    a time
  25. @cowboyd Small Wheels: Boolean Redux

  26. @cowboyd MobX

  27. @cowboyd Unstated

  28. @cowboyd setState

  29. @cowboyd Relax Charles it’s just numbers. It’s just booleans

  30. @cowboyd Booleans aren’t hard They just get hard very quickly

    with composition.
  31. @cowboyd Boolean

  32. @cowboyd Boolean Todo isCompleted

  33. @cowboyd Boolean Todo isCompleted Boolean Todo Array isCompleted … Boolean

    Todo isCompleted TodoList todos
  34. @cowboyd Redux

  35. @cowboyd Boolean

  36. @cowboyd Boolean Todo isCompleted

  37. @cowboyd Boolean Todo isCompleted Boolean Todo Array isCompleted … Boolean

    Todo isCompleted TodoList todos
  38. @cowboyd Numbers increment Booleans toggle Arrays push

  39. @cowboyd

  40. @cowboyd

  41. @cowboyd

  42. @cowboyd Microstates.js Building blocks to make state management fun again.

  43. @cowboyd Redux

  44. @cowboyd MobX

  45. @cowboyd Unstated

  46. @cowboyd setState

  47. @cowboyd Type

  48. @cowboyd numbers can increment

  49. @cowboyd Redux

  50. @cowboyd Weak types Big Boilerplate

  51. @cowboyd Strong types Strong UI

  52. @cowboyd What about TypeScript?

  53. @cowboyd TypeScript is a compiler.

  54. @cowboyd Helps your IDE not your runtime.

  55. @cowboyd Microstates.js Composable Types for immutable data.

  56. @cowboyd Built-in types

  57. @cowboyd Number

  58. @cowboyd Boolean

  59. @cowboyd Array

  60. @cowboyd Composability

  61. @cowboyd Complexity over Time bad good

  62. @cowboyd Let computers do hard work for us.

  63. @cowboyd Your Types

  64. @cowboyd Number 0 age String ‘’ nam e Person

  65. @cowboyd Number 0 age Person

  66. @cowboyd before after

  67. @cowboyd Your Transitions

  68. @cowboyd

  69. @cowboyd

  70. @cowboyd Transitions are atomic

  71. @cowboyd Benefits

  72. @cowboyd Benefits Laziness

  73. @cowboyd Benefits: Laziness

  74. @cowboyd Benefits Immutable

  75. @cowboyd Benefits: immutable Getters

  76. @cowboyd Benefits: immutable Memoization

  77. @cowboyd Benefits Serializable

  78. @cowboyd Benefits Stable

  79. @tarasm

  80. @tarasm

  81. @tarasm setState

  82. @tarasm Redux

  83. @tarasm MobX

  84. @cowboyd Benefits: stable Performant Without optimization

  85. @tarasm Microstates.js

  86. @cowboyd Benefits Tiny

  87. @cowboyd

  88. @cowboyd Use Microstates.js https://github.com/microstates/microstates.js

  89. @cowboyd Let’s do great work together!