a

front-end-system-design

public

90 stars

12 forks

0 issues

Commits

List of commits on branch master.

Verified

9880169b51f7f761a096697f543dbed54e34e5b1

Update README.md

aamilajack committed 5 years ago

Verified

a05adc69ac558e1b8294b2895c1eb9b0def4dfde

Initial commit

aamilajack committed 5 years ago

README

The README file for this repository.

front-end-system-design

A checklist for front end system design

Requirements
- How many users?
- Where are users distributed?
- What is our frame budget?
- Do we need to support mobile?
- Offline support?
- Internationalization?
- Accessibility?
- Browser targets?
Architecture
- MVC
- MVW
- Container/Component Architecture
Data Flow Model
- Two Way Data Binding vs Unidirectional data flow
Component Tree
Design
System Walkthrough
Performance Patterns
- Fast initial load time
  - App shell architecture
  - SSR
  - Caching
  - Rehydrate application state from prev. cached state
- Assets
  - Route based code splitting
  - Minification
  - Dead code stripping
- Network
  - Lazy vs eager loading
  - Service Worker
  - Caching API requests
- Compute
  - WebGL
  - WebAssembly
  - WebWorkers
  - SharedArrayBuffer
- UI
  - Optimistic UI
  - Virtual List
Examples
- Design a facebook messenger client
- Design a gigapixel client
- Design the uber client
- Design the twitter newsfeed
- Design the google docs client
- Design a performance dashboard for a client side app
Readings