Abdallah Hemdan ๐ต๐ธ
@abdallahhemda17
Frontend Tech Lead @Instabug | ICPC World Finalist 2021 | Frontend perf enthusiast #webperf | youtube.com/@ahemdan | hemdan.hashnode.dev
ID: 1071143809441038337
https://www.linkedin.com/in/hemdan99/ 07-12-2018 20:45:59
599 Tweet
2,2K Followers
610 Following
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู20 ู ู ุณูุณูุฉ #frontendperformance ุจุงูุนุฑุจู. ูุงูุญููุฉ ุฏู ููุชููู ุนูู performance technique ุฌุฏูุฏ ููู ุงูู JavaScript Compression ููุชููู ุนูู ุงูู Minification ูุงูู Http Compression, ููุชููู ุนูู ุฃููุงุน ุงูู Compression ุณูุงุก lossy ุงู lossless ูุงุฎูุงุฑูุง
ุงูุณูุงู ุนูููููููููููููููู ุฅู ุดุงุก ุงููู ูุจุฏุฃ ุณูุณูุฉ ููุฏูููุงุช ุฌุฏูุฏุฉ ููุชููู ูููุง ุนู Frontend System Design ุจุงูุนุฑุจู ูุงูู ูู ูุฌูุฉ ูุธุฑู ูุงุญุฏ ู ู ุฃูู ุงูู ูุงุถูุน ูู Frontend ูููู ููุงุณู ุงูููุงู ูุงูู ุตุงุฏุฑ ุนูู ูููู. ููุชููู ูู ุงููุณูุณูุฉ ุฏู ุงู ุดุงุก ุงููู ุนู ู ูุงุถูุน ูุชูุฑุฉ, ููุนุฑู ููู ุงูู Frontend System
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู2 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู. ูุงูุญููุฉ ุฏู ููุชููู ุนูู ุงููุฑู ุจูู ุงูู Frontend System Design ู ุงูู Backend System Design ูููููู ู ุน ุจุนุถ ุงูุฌูุงูุจ ุงูู ุฎุชููุฉ ุงูู ูู ูุงุญุฏ ูููู ุจููุชู ุจููุง, ูููุดูู ุฏู ุนูู ู ุซุงู ูุงุฒุงู ุงูุฃุฎุชูุงูุงุช ุฏู ุจุชุธูุฑ.
Neat lil learning from todayโs performance.now() conference (via Umar Hansa): You can now throttle individual requests in Chrome! Neat for experimenting with stuff like - lazy-loading: does the UI look okay if this chunk takes MUCH longer to arrive? - resilience: what happens if this specific CDN
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู3 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู. ูุงูุญููุฉ ุฏู ููุชููู ุนูู ุงููุฑู ุจูู ุงูู Frontend System Design ู ุงูู Frontend Architecture. ููุจุฏุฃ ู ู ุงูุฃูู ุจุงูููุงู ุนูู ุงูู Software Architecture ูุงูู ุงูู ูุตูุฏ ุจูู ูุงูู definitions ุงูู ุฎุชููุฉ ููู, ูุจุนุฏูู
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู4 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู. ูุงูุญููุฉ ุฏู ููุจุฏุฃ ูุชููู ุนูู RADIO Framework ูููุจุฏุฃ ุจุฃูู ุฎุทูุฉ ููู ุงูู R (Requirement Exploration) ูููุชููู ูุฏ ุงูู ุงูุฎุทูุฉ ุฏู ู ูู ุฉ ูุงูู ุจูุชุจูู ุนูููุง ูู ุงูู Steps ุจุนุฏ ูุฏุง ุณูุงุก ุจูุชููู ุนูู Design Problem ูู
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู5 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู. ูุงูุญููุฉ ุฏู ููุชููู ุนูู ุชุงูู ุฎุทูุฉ ู ุนุงูุง ูู ุงูู RADIO Framework ููู ุงูู Architecture/High-Level Design ููุนุฑู ู ุน ุจุนุถ ุงูู ุงููุฏู ู ู ุงูุฎุทูุฉ ุฏู, ูุงุฒุงู ูู ุจุชุจูู ุนูู ุงูู Requirement Exploration Step ูููุดูู
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู6 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู. ูุงูุญููุฉ ุฏู ููุชููู ุนูู ุชุงูุช ุฎุทูุฉ ู ุนุงูุง ูู ุงูู RADIO Framework ููู ุงูู Data model/Core entities ููุนุฑู ู ุน ุจุนุถ ุงูู ุงููุฏู ู ู ุงูุฎุทูุฉ ุฏู, ูุงุฒุงู ุจุชุณุงุนุฏูุง ููุตู ุงูู system ู ู ูุฌูุฉ ูุธุฑ ุงูู data. ููุชููู ุนูู
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู7 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู. ูุงูุญููุฉ ุฏู ููุชููู ุนูู ุฑุงุจุน ุฎุทูุฉ ู ุนุงูุง ูู ุงูู RADIO Framework ููู ุงูู Interface definition (API), ููุนุฑู ู ุน ุจุนุถ ุงูู ุงูู ูุตูุฏ ุจุงูู API ูู ุงูู Frontend System Design ูุงุฒุงู ุจูุณุชุฎุฏู ุงูู ุตุทูุญ ุฏู ุจุดูู ุฃุดู ู ู ู
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู8 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู. ูุงูุญููุฉ ุฏู ููุชููู ุนูู ุฃุฎุฑ ุฎุทูุฉ ู ุนุงูุง ูู ุงูู RADIO Framework ููู ุงูู Optimizations and deep dive ููุนุฑู ุงูู ุงููุฏู ู ู ุงูุฎุทูุฉ ุฏู ูุงุฒุงู ุฃูู ูุชูุง ูู ุงููุง ุงูุฎุทูุฉ ุงูู ูููุง ุจูุชููู ุนูู ุงูู core area ูู ุงู
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู9 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู. ูุงูุญููุฉ ุฏู ููุชููู ุนูู ูุงุญุฏ ู ู ุฃู ุชุน ุงูู ูุงุถูุน ูู Frontend System Design ููู Component API Design ูู frontend ุจูุชุนุงู ู ู ุน components ุชูุฑูุจุง ุทูู ุงูููุช, ุณูุงุก ุจููุชุจ components ููุงุณ ุจุชุณุชุฎุฏู ูุง ุงู ุจูุณุชุฎุฏู
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู10 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู ููู ุงูุญููุฉ ุฏู ููุชููู ุนูู Appearance as an API ุฃุชููู ูุง ูู ุงูุญููุฉ ุงูู ูุงุชุช ุนูู ุงููgood ู ุงููbad component design ูุงุชููู ูุง ุนูู ุงุฒุงู ุงูู component ุจุชููู ุฃุญุณู ูู ู ุง ูุงูุช customizable ุฃูุชุฑ ูููู ู ุชููู ูุงุด
Earlier this week, we launched Wondercraft Video. Ahead of launch, we gave access to 10 creators and ran a $25K challenge to make our launch video. The results were wild and showed how AI video can be actually useful. RT and comment โWONDAโ and Iโll DM you 1,000 free credits.
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู11 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู ููุชููู ูู ุงูุญููุฉ ุฏู ุนูู Pagination techniques, ููุนุฑู ุงูู ูู ุงูู pagination ูุงูู ุงูู ุดุงูู ุงูู ุจูุญุงูู ูุญููุง ููุชููู ุนูู ุฃุดูุงู ุงูู pagination ู ู ูุงุญูุฉ ุงูู UI/UX ูุงูุฃุฎุชูุงูุงุช ุจูููู ูููุชููู ุนูู ุงูุฌุฒุก ุงูุฃูู
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู12 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู ููุจุฏุฃ ูุชููู ู ู ุงูุญููุฉ ุฏู ุนูู ู ูุถูุน ุฌุฏูุฏ ููู ุงูู Icons rendering techniques ุงูู Icons ุฌุฒุก ุฃุณุงุณู ู ู ุงู website/webapp ุจูุดุชุบู ุนููู ููู ุงูุฃุบูุจ ุจูููู ุนุฏุฏ ุงูู Icons ูู ุงูู page ูุจูุฑุฉ; ู ุน ุฒูุงุฏุฉ ุฃุณุชุฎุฏุงู
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู13 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู ูู ุงูุญููุฉ ุฏู ูููู ู ููุงู ูุง ุนู ุงูู Icons rendering techniques ููุจุฏุฃ ูุชููู ุนูู ุฃูู 3 techniques, ููุนุฑู ู ุน ุจุนุถ ุงุฒุงู ูู ูุงุญุฏ ูููู ุจูุดุชุบู ูุงูุญุงุฌุฉ ุงูู ุงูู technique ุฏู ุจูุญุงูู ูุญููุง, ูุงูู ู ู ูุฒุงุชู ูุนููุจู
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู14 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู ููุชููู ูููุง ุนูู ุฃุฎุฑ ุฌุฒุก ู ู ุงูู Icons rendering techniques ููุดูู ุจุงูุชูุงุตูู ุงูู techniques ุงูู ุจุชุฑูุฒ ุฃูุชุฑ ุนูู ุงูู SVGs ููุชููู ุนูู SVG as asset, Inline SVG ูุฃุฎุฑ ุญุงุฌุฉย SVG Sprites (Internal vs External)
ุงูุณูุงู ุนูููููููููููููููู ุฏู ุงูุญููุฉ ุงูู15 ู ู ุณูุณูุฉ #frontendsystemdesign ุจุงูุนุฑุจู ููุชููู ูู ุงูุญููุฉ ุฏู ุนูู ูุงุญุฏ ู ู ุงูู ูุงุถูุน ุงูู ู ุชุนุฉ ููู ุงูู Normalization ููุจุฏุฃ ููุงู ูุง ุนูู ูุธุฑุฉ ุนูู ุทุจูุนุฉ ุงูู state ูู ุฃุบูุจ ุงูู apps ุงูู ุจูุจูููุง ูุจูุณุชุฎุฏู ูุง ู ู ุญูุซ ุงููุง relational data, ูููุชููู ุนูู ุงูู