Preface

The world of JavaScript has come a long way since I wrote the first edition of Learning JavaScript Design Patterns over 10 years ago. At that time, I was working on large-scale web applications and found that the lack of structure and organization in JavaScript code made it difficult to maintain and scale those applications.

Fast forward to today, and the web development landscape has changed dramatically. JavaScript has become one of the most popular programming languages in the world and is used for everything from simple scripts to complex web applications. The JavaScript language has evolved to include modules, promises, and async/await, which has heavily influenced how we architect applications. The way developers write components, such as with React, has also significantly impacted how they think about maintainability. This has resulted in the need for modern patterns that take these new changes into account.

With the rise of modern libraries and frameworks like React, Vue, and Angular, developers are now building applications that are more complex than ever before. I recognized the need for an updated version of Learning JavaScript Design Patterns to reflect the changes in JavaScript and web application development.

In this second edition of Learning JavaScript Design Patterns, I aim to help developers apply modern design patterns to their JavaScript code and React applications. The book covers more than 20 design patterns essential for building maintainable and scalable applications. The book is not just about design patterns but also about rendering and performance patterns, which are critical to the success of modern web applications.

The first edition of this book focused on classical design patterns, such as the Module pattern, the Observer pattern, and the Mediator pattern. These patterns are still important and relevant today, but the web development world has evolved significantly in the past decade, and new patterns have emerged. This new edition covers these new patterns, such as promises, async/await, and the newer variations of the Module pattern. We also cover architectural patterns such as MVC, MVP, and MVVM and discuss where modern frameworks fit with these architectural patterns.

Today’s developers are exposed to many library-specific or framework-specific design patterns. React’s matured ecosystem and utilization of newer JS primitives provide an excellent launchpad to talk about best practices and patterns in the framework or library context. In addition to classic design patterns, this book covers modern React patterns, such as Hooks, Higher-Order Components, and Render Props. These patterns are specific to React and essential for building modern web applications using this popular framework.

This book is not just about patterns; it’s also about best practices. We cover topics such as code organization, performance, and rendering, which are crucial for building high-quality web applications. You will learn about dynamic imports, code-splitting, server-side rendering, hydration, and Islands architecture, all of which are essential for building fast and responsive web applications.

By the end of this book, you will have a deep understanding of design patterns and how to apply them to your JavaScript code and React applications. You will also know which patterns are relevant to the modern web and which are not. This book is not just a reference for patterns; it’s also a guide to building high-quality web applications. You will learn how to structure your code for maximum maintainability and scalability and how to optimize your code for performance.

Structure of the Book

This book is organized into 15 chapters, designed to walk you through JavaScript design patterns from a modern perspective, incorporating updated language features and React-specific patterns. Each chapter builds upon the previous one, enabling you to grow your knowledge incrementally and apply it effectively:

Throughout the book, practical examples are provided to illustrate the patterns and concepts discussed. By the end of your journey, you’ll have a solid understanding of JavaScript design patterns and be equipped to write elegant, maintainable, and scalable code.

Whether you’re a seasoned web developer or just starting out, this book will provide the knowledge and tools you need to build modern, maintainable, and scalable web applications. I hope that this book will be a valuable resource for you as you continue to develop your skills and build amazing web applications.

Conventions Used in This Book

The following typographical conventions are used in this book:

Italic

Indicates new terms, URLs, email addresses, filenames, and file extensions.

Constant width

Used for program listings, as well as within paragraphs to refer to program elements such as variable or function names, databases, data types, environment variables, statements, and keywords.

Constant width italic

Shows text that should be replaced with user-supplied values or by values determined by context.

Tip

This element signifies a tip or suggestion.

Note

This element signifies a general note.

Using Code Examples

Supplemental material (code examples, exercises, etc.) is available for download at https://github.com/addyosmani/learning-jsdp.

If you have a technical question or a problem using the code examples, please send email to .

This book is here to help you get your job done. In general, if example code is offered with this book, you may use it in your programs and documentation. You do not need to contact us for permission unless you’re reproducing a significant portion of the code. For example, writing a program that uses several chunks of code from this book does not require permission. Selling or distributing examples from O’Reilly books does require permission. Answering a question by citing this book and quoting example code does not require permission. Incorporating a significant amount of example code from this book into your product’s documentation does require permission.

We appreciate, but generally do not require, attribution. An attribution usually includes the title, author, publisher, and ISBN. For example: “Learning JavaScript Design Patterns, 2nd ed., by Addy Osmani (O’Reilly). Copyright 2023 Adnan Osmani, 978-1-098-13987-2.”

If you feel your use of code examples falls outside fair use or the permission given above, feel free to contact us at .

O’Reilly Online Learning

Note

For more than 40 years, O’Reilly Media has provided technology and business training, knowledge, and insight to help companies succeed.

Our unique network of experts and innovators share their knowledge and expertise through books, articles, and our online learning platform. O’Reilly’s online learning platform gives you on-demand access to live training courses, in-depth learning paths, interactive coding environments, and a vast collection of text and video from O’Reilly and 200+ other publishers. For more information, visit https://oreilly.com.

How to Contact Us

Please address comments and questions concerning this book to the publisher:

  • O’Reilly Media, Inc.
  • 1005 Gravenstein Highway North
  • Sebastopol, CA 95472
  • 800-998-9938 (in the United States or Canada)
  • 707-829-0515 (international or local)
  • 707-829-0104 (fax)

We have a web page for this book, where we list errata, examples, and any additional information. You can access this page at https://oreil.ly/js_design_patterns_2e.

Email to comment or ask technical questions about this book.

For news and information about our books and courses, visit https://oreilly.com.

Find us on LinkedIn: https://linkedin.com/company/oreilly-media

Follow us on Twitter: https://twitter.com/oreillymedia

Watch us on YouTube: https://youtube.com/oreillymedia

Acknowledgments

I would like to thank the amazing reviewers for the second edition, including Stoyan Stefanov, Julian Setiawan, Viswesh Ravi Shrimali, Adam Scott, and Lydia Hallie.

The first edition’s passionate, talented technical reviewers included Nicholas Zakas, Andrée Hansson, Luke Smith, Eric Ferraiuolo, Peter Michaux, and Alex Sexton. They—as well as members of the community at large—helped review and improve this book, and the knowledge and enthusiasm they brought to the project was simply amazing.

A special thanks to Leena Sohoni-Kasture for her contributions and feedback to the editing of the second edition.

Finally, I would like to thank my wonderful wife, Elle, for all of her support while I was putting together this publication.