High-Performance and Scalable webapp

20210416 LINE Developers Meetup #15 @ 清大教育館 by Liz Lin

Event: https://linegroup.kktix.cc/events/20210416

Transcript

1. High-Performance and Scalable webapp LINE TODAY Frontend - Liz Lin
2. Introduction
3. LINE TODAY Product Scope Election News Poll Video Weather Thailand Lottery Live Movie Comment
4. Challenge
5. • Heavy Product Traffic • Large Product Scope Challenge
6. • Performance • Scalable Challenge
7. • Performance • Scalable Challenge
8. Performance https://memeguy.com/photos/images/slow-loading-gifs-62730.png
9. Performance
10. Performance • First Contentful Paint • how long it takes the browser to render the first piece of DOM content after a user navigates to your page. https://web.dev/fcp/
11. Performance • Server Side Rendering
12. Performance • Server Side Rendering • Universal Rendering(Isomorphic Javascript)
13. NUXTJS • Complement Document • Clean Code Structure • Isomorphic Javascript • Plugins • i18n, Sentry
14. • Performance • Scalable Challenge
15. Scalable
16. Scalable
17. • Complicated Business Logic • Highly Coupled Component Scalable - Problems
18. Scalable - monorepos • Reusable SDK
19. • Reduce Main File Size • Separate Business Logic • Reusable Component Scalable – async component
20. Summary
21. • First Content Paint fast 80% • Main File Size Reduce 75% Summary
22. Thank you