What is LWC | Advantages

Lightning Web Component

LWC Definition

Lightning Web Components is a stack of modern lightweight frameworks built on the latest web standards.

Lightning web components are custom HTML elements built using HTML and modern JavaScript.

LWC Technology

Lightning Web Components consist of four Separate Technologies:

Custom Elements: The HTML elements with custom templates, tag names like and behaviors are made with a set of JavaScript APIs. HTML Living Standard Specification has definitions of these Custom Elements.

Shadow DOM: We use this for isolating CSS and JavaScript which could be like. Living Standard DOM Specification has the definitions of this.

HTML Templates: User – Defined templates in HTML are rendered only when called upon HTML Living Standard Specification has the definition of the tag.

ES Modules: The ES Modules Specification defines the inclusion and reuse of JS documents in a standard based, modular, performant way.

LWC Advantage / Characteristics

Easy to Learn: LWC is basically takes the form through native web standards that is in the browser.

It means that no added abstraction layer like Aura Framework or any other framework, we only need standard JavaScript to develop.

Better Performance: Because of the no added abstraction layer, LWC is likely to render faster than aura components since performance is important to deliverability.

Faster Loading Sites: Like lightning, LWC is faster in loading the developed components than Aura Components and is lightweight framework which is built on web standards.

More Standards, Less Proprietary: LWC has built in browser security features from web Components standards, so the usage of out of the box is more and less of customization. We all know that Aura is proprietary so with LWC, the more we know about web standards; More we’ll have the skill that can be used in other technologies as well.

Common Components/ Service Components: We can now write components that have no User Interface in LWC, and those components can be reused in other components which are more efficient than Static Resources.

Easier to ramp for developers: No additional framework is needed to learn in order to develop LWC and hence transaction for the developers is a lot easier.

Better Security, Better Testing and Better Browser Compatibility: With LWC, CSS, Script and DOM isolation are better and has more limited event scope. With each of these we have more consistency in designing Components. LWC also supports Two-Way data binding with which we can coordinate how data moves between Components.