Expectations vs Reality When Implementing vue.js
0 likes206 views
The document discusses the challenges and benefits of implementing Vue.js at Cognito Forms, focusing on the transition from outdated technologies like jQuery and msajax to a more modern framework. It highlights Vue's incremental adoptability, ease of integration, and capabilities for building sophisticated applications, alongside the complexities of refactoring existing code and managing build processes. The author emphasizes the positive impact of using modern testing and development tools within the Vue ecosystem.
![[WIP]](https://image.slidesharecdn.com/ato-2019-190424140754/85/Expectations-vs-Reality-When-Implementing-vue-js-34-320.jpg)
Expectations vs Reality When Implementing vue.js
- 1. Expectations vs Reality When Implementing Vue.js Taylor Kimmett Software developer at Cognito Forms
- 7. Aging client technology ▪ jQuery – 12 years old ▪ MSAjax – 10 years old ▪ ExoWeb ▪ open source library we built
- 8. Maintenance ▪ Loosely connected scripts ▪ JS + HTML in C#
- 12. Packaging
- 13. Limited community ▪ Third party software ▪ Documentation, learning resources
- 14. Size ▪ jQuery: 91KB ▪ MsAjax: 121KB ▪ Vue + compiler: 92KB 212KB jQuery + MsAjax 92KB Vue + compiler
- 15. The Promise of Vue
- 16. From the docs Vue is a progressive framework for building user interfaces. Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable. The core library is focused on the view layer only, and is easy to pick up and integrate with other libraries or existing projects. On the other hand, Vue is also perfectly capable of powering sophisticated Single-Page Applications when used in combination with modern tooling and supporting libraries.
- 18. Components
- 19. Single File Components ▪ Organization ▪ Clarity ▪ Separation of Concerns?
- 20. The Realities of Refactor
- 21. Where to start? ▪ Two sides of Cognito ▪ More complex first Admin Public Form
- 22. The build step ▪ A necessary evil? ▪ Webpack ▪ Modules ▪ Configuration galore ▪ A force for good
- 28. Improve cashing
- 29. Improve caching
- 30. Optimize requests ▪ Code generation approach ▪ Vue + Webpack approach
- 32. Testing ▪ An unexpected gift ▪ Current testing strategy ▪ Jest ▪ Easy, fast, fun
- 33. Development community ▪ vuejs.org/ ▪ github.com/chrisvfritz/vue- enterprise-boilerplate ▪ element.eleme.io
- 34. [WIP]
- 36. The future
- 38. The future ▪ Beta ▪ Compatibility ▪ Admin ▪ Optimistic