WeAreDevelopers Logo WeAreDevelopers
Sign in
For You LIVE
World Congress 2023 • Sep 27, 2023

10 must-know design patterns for JS Devs

Erick Wendel

Are you using TypeScript like a Ferrari to deliver pizza? Master these ten essential Vanilla JavaScript design patterns to transform messy scripts into highly scalable applications.

Pause
Mute Enter Fullscreen
#1 about 5 min

Identifying problems in single-file JavaScript applications

Global state and lack of folder structure create hard-to-maintain legacy codebases.

#2 about 4 min

Organizing code with single responsibility and factory patterns

Applying the single responsibility principle splits functionality into manageable views, controllers, and services.

#3 about 4 min

Building universal applications with the abstract factory pattern

Standardizing contracts shares core logic between web and terminal interfaces.

#4 about 3 min

Structuring complex components with builder and fluent APIs

The builder pattern creates modular UI components and flexible queries without massive configuration files.

#5 about 3 min

Reusing state configuration with the test data builder

The test data builder standardizes mock setups and HTTP responses to avoid copy-pasting scenarios.

#6 about 2 min

Managing application events using the observer design pattern

The observer pattern decouples event subscriptions and notifications for analytics and logging integrations.

#7 about 4 min

Injecting behaviors dynamically using the decorator pattern

Decorator functions extend capabilities like performance tracking without modifying the underlying implementation.

#8 about 3 min

Processing large payloads efficiently with streams and generators

Consuming data on demand using the yield keyword prevents UI blocking during large payloads.

#9 about 5 min

Exploring ECMAScript private fields and TypeScript adoption trade-offs

Audience questions cover private class fields in modern JavaScript and the necessity of TypeScript.

Matching moments

1:22 min

Introduction to front-end architecture design patterns

Abdu Taviq Abdu Taviq · Europe 2026 Virtual

2:28 min

Expected features and performance defaults in modern JavaScript frameworks

Sasha Shynkevich · LIVE

5:10 min

Evaluating the operational trade-offs of modern javascript frameworks

Chris Heilmann Chris Heilmann +2 · LIVE

5:05 min

Identifying scenarios where JavaScript remains an essential tool

Aaron T. Grogg · Coffee With Developers

2:37 min

Addressing the complaints about JavaScript as a programming language

Sasha Shynkevich · LIVE

2:11 min

Answering audience questions on JavaScript performance strategies

Michele Riva · World Congress 2023

More from World Congress 2023

The year 3000, a brief history of Web Development thumbnail
25:30
over 2 years ago

The year 3000, a brief history of Web Development

Lorenzo Pieri

Demografie nutzen um jedem Bewerber das passende Angebot zu machen! thumbnail
8:52
almost 3 years ago

Demografie nutzen um jedem Bewerber das passende Angebot zu machen!

Nathalie Gierth

Guided Memory Management: Rust's Ownership Model thumbnail
0:18
almost 3 years ago

Guided Memory Management: Rust's Ownership Model

Stefan Baumgartner

Passwordless future: WebAuthn and Passkeys in practice thumbnail
32:32
almost 3 years ago

Passwordless future: WebAuthn and Passkeys in practice

Clemens Hübner

External Secrets Operator: the secrets management toolbox for self-sufficient teams thumbnail
30:07
almost 3 years ago

External Secrets Operator: the secrets management toolbox for self-sufficient teams

Moritz Johner

Building Reliable Serverless Applications with AWS CDK and Testing thumbnail
25:18
almost 3 years ago

Building Reliable Serverless Applications with AWS CDK and Testing

Raphael Manke

Upcoming sessions on this topic

Open session

Designing for Every Direction: Logical CSS for Global, Adaptive, and Effortlessly Reversible UIs

  • Vidhya Krishnamoorthy

    Morgan Stanley

    VP, Software Engineering Manager

Open session

From Profiler to Production: Measuring What Actually Matters in React & React Native

  • Andrei Tazetdinov

    Dynatrace

    React Native Developer

Open session

React Under Fire: Rendering Performance for Streaming Agent UIs

  • Abhirupa Mitra

    Slack

    Senior Member of Technical Staff

Open session

Teaching AI Coding Agents to Build It Right the First Time

  • Sajeetharan Sinnathurai

    Microsoft

    Principal Product Manager

Open session

Supply Chain Security for the Everyday Engineer

  • Pradumna Saraf

    Kestra Technologies

    Quality Assurance Engineer

Open session

Build a Zero-Cost AI Agent in Your Browser

  • Aishwarya Mathuria

    Adobe

    Computer Scientist

  • Nishant Thakur

    Adobe

    Senior Computer Scientist

Related videos

The Lean Web thumbnail
46:46
JS Congress • almost 5 years ago

The Lean Web

Chris Ferdinandi

How to Stop Choosing JavaScript Frameworks and Start Living thumbnail
43:57
LIVE • over 5 years ago

How to Stop Choosing JavaScript Frameworks and Start Living

Sasha Shynkevich

Frontend Abstractions: Frameworks and Applications Architectural Patterns thumbnail
33:00
Europe 2026 Virtual • 4 months ago

Frontend Abstractions: Frameworks and Applications Architectural Patterns

Abdu Taviq

The Naked Web Developer: Your Browser Is Your Framework thumbnail
42:46
World Congress 2021 • over 5 years ago

The Naked Web Developer: Your Browser Is Your Framework

Avichay Eyal

WeAreDevelopers LIVE – Spicy Vanilla Web, CSS Magic & More thumbnail
59:40
LIVE • 11 months ago

WeAreDevelopers LIVE – Spicy Vanilla Web, CSS Magic & More

Chris Heilmann, Daniel Cranney, Peter Kröner

Component styling in a JS world — evolve your mental model thumbnail
41:28
JS Congress • almost 5 years ago

Component styling in a JS world — evolve your mental model

Maximilian Heinrich

Related articles

From learning to earning

Jobs that call for the skills explored in this talk.