Learning JavaScript Design Patterns: A JavaScript and React Developer’s Guide, 2nd Edition

https://kirkmanandjourdain.com/b5b358aack Preface Structure of the Book Conventions Used in This Book Using Code Examples O’Reilly Online Learning How to Contact Us Acknowledgments 1. Introduction to Design Patterns History of Design Patterns What Is a Pattern? An Everyday Use Case for Design Patterns Summary 2. “Pattern”-ity Testing, Proto-Patterns, and the Rule of Three What Are Proto-Patterns? The “Pattern” Tests Rule of Three Summary 3. Structuring and Writing Patterns The Structure of a Design Pattern Well-Written Patterns Writing a Pattern Summary 4. Anti-Patterns What Are Anti-Patterns? Anti-Patterns in JavaScript Summary 5. Modern JavaScript Syntax and Features The Importance of Decoupling Applications Modules with Imports and Exports Module Objects Modules Loaded from Remote Sources Static Imports Dynamic Imports Import on Interaction Import on Visibility Modules for the Server Advantages of Using Modules Classes with Constructors, Getters, and Setters Classes in JavaScript Frameworks Summary Related Reading 6. Categories of Design Patterns Background Creational Design Patterns Structural Design Patterns Behavioral Design Patterns Design Pattern Classes Summary 7. JavaScript Design Patterns Creational Patterns The Constructor Pattern Object Creation Basic Constructors Constructors with Prototypes The Module Pattern Object Literals The Module Pattern Module Pattern Variations Modern Module Pattern with WeakMap Modules with Modern Libraries The Revealing Module Pattern Advantages Disadvantages The Singleton Pattern State Management in React The Prototype Pattern The Factory Pattern When to Use the Factory Pattern When Not to Use the Factory Pattern Abstract Factories Structural Patterns The Facade Pattern The Mixin Pattern Subclassing Mixins Advantages and Disadvantages The Decorator Pattern Pseudoclassical Decorators Interfaces Abstract Decorators Advantages and Disadvantages Flyweight Using Flyweights Flyweights and Sharing Data Implementing Classical Flyweights Converting Code to Use the Flyweight Pattern A Basic Factory Managing the Extrinsic States The Flyweight Pattern and the DOM Example: Centralized Event Handling Behavioral Patterns The Observer Pattern Differences Between the Observer and Publish/Subscribe Pattern Advantages Disadvantages Publish/Subscribe Implementations The Mediator Pattern A Simple Mediator Similarities and Differences Event Aggregator Use Mediator Use Event Aggregator (Pub/Sub) and Mediator Together Mediator/Middleware in Modern JavaScript Mediator Versus Facade The Command Pattern Summary 8. JavaScript MV* Patterns MVC Smalltalk-80 MVC MVC for JavaScript Developers Models Views Templating Controllers What Does MVC Give Us? Smalltalk-80 MVC in JavaScript Summary of MVC MVP Models, Views, and Presenters MVP or MVC? MVVM History Model View ViewModel Recap: The View and the ViewModel ViewModel Versus Model Pros and Cons Advantages Disadvantages MVC Versus MVP Versus MVVM Modern MV* Patterns MV* and React.js Summary 9. Asynchronous Programming Patterns Asynchronous Programming Background Promise Patterns Promise Chaining Promise Error Handling Promise Parallelism Promise Sequential Execution Promise Memoization Promise Pipeline Promise Retry Promise Decorator Promise Race async/await Patterns async Function Composition async Iteration async Error Handling async Parallelism async Sequential Execution async Memoization async Event Handling async/await Pipeline async Retry async/await Decorator Additional Practical Examples Making an HTTP Request Reading a File from the Filesystem Writing to a File on the Filesystem Executing Multiple async Operations Executing Multiple async Operations in Sequence Caching the Result of an async Operation Handling Events with async/await Retrying an async Operation on Failure Creating an async/await Decorator Summary 10. Modular JavaScript Design Patterns A Note on Script Loaders AMD Getting Started with Modules AMD Modules with jQuery AMD Conclusions CommonJS Getting Started Consuming Multiple Dependencies CommonJS in Node.js Is CommonJS Suitable for the Browser? Related Reading for CommonJS AMD and CommonJS: Competing, but Equally Valid Standards UMD: AMD and CommonJS-Compatible Modules for Plug-ins Summary 11. Namespacing Patterns Namespacing Fundamentals Single Global Variables Prefix Namespacing Object Literal Notation Nested Namespacing Immediately Invoked Function Expressions Namespace Injection Advanced Namespacing Patterns Automating Nested Namespacing Dependency Declaration Pattern Deep Object Extension Recommendation Summary 12. React.js Design Patterns An Introduction to React Terminology Used Basic Concepts Higher-Order Components Composing Pros Cons Render Props Pattern Lifting State Children as a Function Pros Cons Hooks Pattern Class Components Restructuring Complexity Hooks State Hook Effect Hook Custom Hooks Additional Hooks Guidance Pros and Cons of Using Hooks React Hooks Versus Classes Static Import Dynamic Import Loadable Components Import on Interaction Import on Visibility Code-Splitting Route-based Splitting Bundle Splitting PRPL Pattern Loading Prioritization Preload in Single-Page Apps Preload + the async Hack Preload in Chrome 95+ List Virtualization How Does Windowing/Virtualization Work? Lists Grid Improvements in the Web Platform Conclusions Summary 13. Rendering Patterns Importance of Rendering Patterns Client-Side Rendering Server-Side Rendering Static Rendering Incremental Static Regeneration On-Demand ISR Summary of Static Rendering Streaming SSR Edge SSR Hybrid Rendering Progressive Hydration Islands Architecture Implementing Islands Pros and Cons React Server Components Hybrid Rendering with RSC and the Next.js App Router Summary 14. Application Structure for React.js Introduction Group by Module, Feature, or Route Group by File Type Hybrid Grouping Based on Domain and Common Components Application Structure for Modern React Features Redux Containers Hooks Styled Components Other Best Practices Application Structure for Next.js Apps Summary 15. Conclusions Appendix. References Index About the Author