Choosing Vue.js

Transcript

1. 65K+ Stars Top 10 All Time

2. 250K+ Weekly Active Users Chrome DevTools Extension

3. None
4. None

5. Rahul Kadyan Vue.js Core Contributor Software Engineer - Myntra

6. Choosing xxx Choosing Vue

7. Team Choosing for your team 1. Simplicity 2. Resources 3.

   Performance

8. It’s simple

9. None

10. krausest/js-framework-benchmark 0.9 0.975 1.05 1.125 1.2 Slowdown 1.04 1.19 1.15

    Angular React Vue

11. Tech Choosing for features 1. Declarative Rendering 2. Composition 3.

    Stylesheets or CSS
12. None

13. { template: `<App> <Sidebar /> <Content> <p>Hello World </p> </Content>

    </App>` } HTML { render () { return ( <App> <Sidebar /> <Content> <p>Hello World </p> </Content> </App> ) } } JSX { render (h) { return h('App', [ h('Sidebar'), h('Content', [ h( 'p', 'Hello World’ ) ]) ]) } } JS
14. None

15. <app> <app-header></app-header> <app-footer></app-footer> </app> <div class="container"> <header> <slot name="header"></slot> </header>

    <main> <slot></slot> </main> <footer> <slot name="footer"></slot> </footer> </div> <div class="parent"> <child> <template scope="props"> <span>hello from parent</span> <span>{{ props.text }}</span> </template> </child> </div>
16. None

17. <child message=“hello!"></child> <child :my-message="parentMsg"></child> <input @keyup.enter="submit">

18. None
19. None

20. Tech Choosing for large applications 1. Client Side Routing 2.

    Application State 3. Optimisation Efforts
21. None
22. None
23. None

24. Tech Choosing for emerging markets 1. Server Side Rendering

25. None

26. DX Choosing for developer experience 1. Collocation 2. Editor Support

    3. Build & Test Tools 4. Browser DevTools

27. Templates Scripts Styles

28. Template Script Style

29. posva/vim-vue vuejs/vetur vuejs/vue-syntax-highlight

30. None

31. vue-test-utils In pre-release stage.

32. None
33. None

34. – Jacob Schatz, Lead Frontend Developer, GitLab “We chose it

    (vue) because it was more simple than everything out at there. It makes it easy to grasp the concepts and it was also easy to make a large app.”

35. @znck0