Các vấn đề về SEO, Shared Module, Optimize Performance trong React

1. Speaker: Phan Thanh Tùng - Founder tungtung.vn
Github: http://github.com/thanhtungdp
Email: tungptkh@gmail.com
SEO Google, Bing,
Yahoo
Optimize
Performance
Shared code with
teambit/bit
Tối ưu quy trình phát triển ứng dụng
Nâng cao chất lượng sản phẩm

2. SPA SEO Problem
Single page application
Chỉ hoạt động khi javascript của
trình duyệt được bật
Chưa tương thích hoàn toàn với
các công cụ tìm kiếm
Trải nghiệm nhanh, người dùng
yêu thích sản phẩm
Giảm người dùng tự nhiên

3. Server rendering React is hard
🙃 Không tương thích với css module
😤 Xung đột với các module trên browser
⏰ Mất nhiều thời gian

4. Next.js for SEO
Framework for React SSR
Save your time development
Clean code, easy learn
Dynamic import
Deploy easy
Flexible integrateBest framework for
development & deploy
React App

5. Optimize performance

6. Update component
Need update

7. We want
Need update

8. React do
Render all Render all
Render all

9. Optimize
Đo lường (react-addons-perf)

10. Optimize
Benchmarking(react-perf-tool)

11. Optimize
Use ‘shouldComponentUpdate()’
Use ‘React.PureComponent()’

12. And more
⚙️ Making Data Immutable (Immutable.js)
📊 Enabling Gzip on Your Web Server
✍️ Using Eslint-plugin-react

13. React Shared Code

14. Sharing code is hard
n … packages
Publish Discoverability Maintainability

15. Shared code via 3rd party

16. bitsrc.io
Isolate Sync Extend 100% git

17. 📖Documents
⚙️ https://www.toptal.com/react/optimizing-react-
performance
📊 https://zeit.co/docs/examples/next
✍️ Using Eslint-plugin-react
🚀 https://bitsrc.io

18. Thanks you
Speaker: Phan Thanh Tùng - Founder tungtung.vn
Github: http://github.com/thanhtungdp
Email: tungptkh@gmail.com