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

I love react, but due is also good

I love react, but due is also good

The presentation material on "v-tw meetup #005 X LINE Fukuoka" at Taipei


LINE Developers

October 21, 2019

More Decks by LINE Developers

Other Decks in Programming


  1. I love react, but vue is also good Jesse Chen

    vue.tw meetup 10/21/2019
  2. From Taipei, Taiwan Former KKTV web developer
 Now LINE Fukuoka

    Working on Creator’s Market
  3. my f2e development footprints

  4. f2e frameworks v1

  5. vanilla js https://www.slideshare.net/JesseChienChenChen/yapijs-an-adaptive-streaming-web-player

  6. vanilla js just like React !

  7. react.js • Didn’t use JSX in the very beginning, only

    React.createElement • Didn’t use redux in the beginning neither https://www.kktv.me
  8. None
  9. https://www.yunli-design.com/ https://www.xingmobility.com/ https://wedding-invitation.com/

  10. v1 to https://creator.line.me/

  11. What is frontend engineers’ job?

  12. What is frontend engineers’ job? to display things on the

  13. biggest innovation for rendering

  14. imperative declarative

  15. declarative imperative

  16. template Latest layout declarative rendering

  17. dynamic template Latest layout declarative rendering

  18. template engine

  19. the whole part would be overwritten on every change

  20. How do react and vue do?

  21. Latest vDOM template Reconciliation

  22. reconciliation = update layout efficiently!

  23. how to trigger update

  24. Vue React

  25. mount and update

  26. different ways to update Vue React reactive v.s functional

  27. vDOM optimization hoist diff algorithm

  28. ideas both sides agreed • vDOM • Component base •

    props is the only interface for components to communicate • Emphasize on state management
  29. differences • How vDOM works • template string vs JSX

    • Slots • How to reuse logic • vuex vs redux
  30. What merits frontend ecosystems provide? • clear interface - declarative

    - componentized • reliability - easy to maintain • performance?
  31. Thank you! Any questions?