Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.

Expectations vs Reality When Implementing vue.js

26 visualizaciones

Publicado el

Presented at: Open Source 101 - Columbia 2019
Presented by: Taylor Kimmett, Cognito Forms

April 18th, 2019
Columbia, SC, USA

Publicado en: Tecnología
  • Sé el primero en comentar

  • Sé el primero en recomendar esto

Expectations vs Reality When Implementing vue.js

  1. 1. Expectations vs Reality When Implementing Vue.js Taylor Kimmett Software developer at Cognito Forms
  2. 2. Powerful, beautiful forms
  3. 3. Addressing Technical Debt
  4. 4. Aging client technology ▪ jQuery – 12 years old ▪ MSAjax – 10 years old ▪ ExoWeb ▪ open source library we built
  5. 5. Maintenance ▪ Loosely connected scripts ▪ JS + HTML in C#
  6. 6. Packaging
  7. 7. Limited community ▪ Third party software ▪ Documentation, learning resources
  8. 8. Size ▪ jQuery: 91KB ▪ MsAjax: 121KB ▪ Vue + compiler: 92KB 212KB jQuery + MsAjax 92KB Vue + compiler
  9. 9. The Promise of Vue
  10. 10. 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.
  11. 11. Incremental inclusion
  12. 12. Components
  13. 13. Single File Components ▪ Organization ▪ Clarity ▪ Separation of Concerns?
  14. 14. The Realities of Refactor
  15. 15. Where to start? ▪ Two sides of Cognito ▪ More complex first Admin Public Form
  16. 16. The build step ▪ A necessary evil? ▪ Webpack ▪ Modules ▪ Configuration galore ▪ A force for good
  17. 17. Mapping components
  18. 18. Translating MSAjax
  19. 19. Integrating ExoWeb
  20. 20. Simplify code generation
  21. 21. Improve cashing
  22. 22. Improve caching
  23. 23. Optimize requests ▪ Code generation approach ▪ Vue + Webpack approach
  24. 24. Testing ▪ An unexpected gift ▪ Current testing strategy ▪ Jest ▪ Easy, fast, fun
  25. 25. Development community ▪ vuejs.org/ ▪ github.com/chrisvfritz/vue- enterprise-boilerplate ▪ element.eleme.io
  26. 26. [WIP]
  27. 27. The future
  28. 28. The future ▪ Beta ▪ Compatibility ▪ Admin ▪ Optimistic
  29. 29. Thank you cognitoforms.com/vue

×