Skip to main content

Design Pattern ↔ General reusable solution to (common) problem in Software design

MVC​

(Design Pattern) to architect App as 3 core Concern: MVC (Model View Controller )

Memoization​

(Design Pattern) to Cache/reuse previous return value from Pure Function for specific args, to optimize perf

Lazy Loading​

(Design Pattern) to defer load of Non-Blocking non-critical components, until required, to optimize overall network loading speed

Code Splitting​

(Design Pattern)to load Source Code in Chunks, as needed vs all at once

Cheap, Fast or Good?​

design/focus constraint - only can pick 2

DevOps​

(Paradigm) to iterate faster TBD smaller steps via CI/CD integration, push code ASAFP

Windowing​

(Design Pattern) to virtualize & only render subset of data, enough to fill Visual Viewport

DRY​

(principle) to avoid repeat Code/etc via Abstraction/Functional Programming

Debouncing​

(Design Pattern) to delay/reset high frequency input with threshold before action

PRPL​

Design Pattern to Prefetch critical Blocking assets Render init Routes ASAP Pre-Cache assets Lazy Load non-essential assets

References​

  1. Function Overload ↔ Design Pattern to reuse multiple versions of same function with various Signatures

  2. IIFE ↔ Design Pattern to run self-executing Anon Function once & disappear

  3. Code Splitting ↔ (Design Pattern)to load Source Code in Chunks, as needed vs all at once

  4. Event Delegation ↔ (Design Pattern) to attach Event Listener to common parent to utilize Bubbling Phase to apply Event to multiple Element

  5. JSX Branching ↔ Design Pattern for

  6. Lazy Loading ↔ (Design Pattern) to defer load of Non-Blocking non-critical components, until required, to optimize overall network loading speed

  7. Memoization ↔ (Design Pattern) to Cache/reuse previous return value from Pure Function for specific args, to optimize perf

  8. Incremental Computation ↔ (Design Pattern) to compute only Diff, build upon previous calc, avoid repeat work for better perf

  9. Windowing ↔ (Design Pattern) to virtualize & only render subset of data, enough to fill Visual Viewport

  10. SEO ↔ (Design Pattern) to optimize Web Page max exposure to Search Engine's Web Crawler

  11. URL Slug ↔ (Design Pattern) to name Resource Path as Semantic keywords in kebab-case for better SEO

  12. React Router Patterns ↔ Design Pattern for react router & snippet examples

  13. Debouncing ↔ (Design Pattern) to delay/reset high frequency input with threshold before action

  14. redux ↔ (Design Pattern) to colocate state in global external central store, to control data flow with predictable scalable pattern of Dispatch > Reducer > Store

  15. ORM ↔ (Design Pattern) data layer to abstract Backend Code from DB

  16. Semantic CSS ↔ (Design Pattern) to name CSS classes with descriptive human-readable Semantics

  17. MVC ↔ (Design Pattern) to architect App as 3 core Concern: MVC (Model View Controller )

  18. Inversion of Control ↔ Design Pattern to invert Control Flow to Callback to increase Modularity & decouple Deps ??

  19. Mutual Recursion ↔ Design Pattern for two functions to Recusively call each other

  20. PRPL ↔ Design Pattern to Prefetch critical Blocking assets Render init Routes ASAP Pre-Cache assets Lazy Load non-essential assets