ApexSensei

Advantages

LWC stays fast in the browser, keeps styles inside shadow DOM, and runs under Lightning Web Security.

The browser does the rendering

Because the component is a web component, the browser renders it. The framework updates the DOM when a field used in the template changes. You describe the HTML. You do not write the DOM updates yourself.

That is the performance claim that matters: less framework code between your JavaScript and the screen.

Styles stay put

Shadow DOM is the default, so CSS in a parent does not leak into the component, and CSS in the component does not leak out.

When a parent really must style the inside, light DOM is the opt-in. It is a choice per component, and base components stay in shadow DOM.

A current security model

Lightning Web Security lets code from another namespace run beside yours while keeping each namespace in its own sandbox. You can import a component from another namespace when LWS is on.

Under Lightning Locker, a custom component is limited to the c and lightning namespaces. Write the component so it is happy under LWS, which is the architecture Salesforce ships now.

Example

javascript

import { LightningElement } from 'lwc';

export default class StageBadge extends LightningElement {
  stage = 'Prospecting';
}