DEV Community

Nhan Nguyen
Nhan Nguyen

Posted on

1

Simple JavaScript Signal Concept

šŸ”Ž What Are Signals?

Signals are basic units of data that can automatically alert functions or computations when the data they hold changes.

This alerting capability allows parts of a system to automatically and immediately update when the data changes, making the system feel dynamic and real-time.

This solves the problem of updating something visually when some data changes behind the scenes.

When data changes, a function is triggered to update a specific element on the DOM.

An example is here: https://stackblitz.com/edit/vitejs-vite-yh3tpb?file=signals.js

šŸš€ How Do Signals Work?

We defined a variable mySignal to hold our reactive signal.

We call the subscribe method on our returned and bind a function that will be called whenever our value setter is called, which will update the DOM.

Now whenever we set the value of our signal, our subscriber is notified, and the DOM is updated!

At the root, this is what's happening with signals. Of course, frameworks implement many additional features, such as derives and effects. In Angular's case, we have Angular Signals that use further improvements to performance.

Angular Signals details are here: https://angular.io/guide/signals


I hope you found it useful. Thanks for reading. šŸ™

Let's get connected! You can find me on:

SurveyJS custom survey software

JavaScript UI Library for Surveys and Forms

Generate dynamic JSON-driven forms directly in your JavaScript app (Angular, React, Vue.js, jQuery) with a fully customizable drag-and-drop form builder. Easily integrate with any backend system and retain full ownership over your data, with no user or form submission limits.

View demo

Top comments (0)

SurveyJS custom survey software

JavaScript Form Builder UI Component

Generate dynamic JSON-driven forms directly in your JavaScript app (Angular, React, Vue.js, jQuery) with a fully customizable drag-and-drop form builder. Easily integrate with any backend system and retain full ownership over your data, with no user or form submission limits.

Learn more

GenAI LIVE! | June 4, 2025

GenAI LIVE! is a dynamic live-streamed show exploring how AWS and our partners are helping organizations unlock real value with generative AI.

Tune in to the full event

DEV is partnering to bring live events to the community. Join us or dismiss this billboard if you're not interested. ā¤ļø