Hi everyone. This is the new episode of Front-End System design. Today we're going to become google engineers and try to design a Google Sheet App. That's a quite complex application that has many interesting design decisions that we can make. I'm looking forward to your comments and suggestions 🍻
00:00 - 1. Start
03:14 - 2. General Requirements
04:34 - 3. Specific Requirements
05:57 - 4. Action Plan
07:01 - 5. Design Consideration
08:10 - 6.1 Rendering Engine: Canvas
09:21 - 6.2 Rendering Engine: DOM
10:43 - 6.3 Rendering Engine Decision
12:02 - 7. High-level components hierarchy
13:03 - 8. Virtualisation
24:02 - 8.1 Article recommendation
25:21 - 9. Dependecy Resolving
32:52 - 9.1 Great video about topological ordering
33:13 - 10. Formula Parsing
35:03 - 11. State Management
38:58 - 12. Optimisation
41:14 - 13. Accessibility
Diagram Link: https://viewer.diagrams.net/?tags=%7B%7D&highlight=0000ff&edit=_blank&layers=1&nav=1&title=GSheet-System-Design.drawio#Uhttps%3A%2F%2Fdrive.google.com%2Fuc%3Fid%3D1Ca3fmVk-UDWlfhj_Mf6G4d4hl-zJqt6L%26export%3Ddownload
Telegram: https://t.me/frontend_engineer_blog
Medium: https://evgeniiray.medium.com/
Linkedin: https://www.linkedin.com/in/evgenii-ray/
#systemdesign #frontend #frontenddev