With latest announcement of Lightning Web Components, Salesforce development ecosystem(Lightning Platform) moves one step closer to using web standards of UI development.It is definitely quite welcome move,as it helps in learning and utilizing skills which are not confined to Salesforce ecosystem.

Background:

User interface development has evolved drastically in past decade. With introduction of AngujarJS(2010),javascript based front end development became more modularized and then with React(2015)it became much faster,lightweight and component driven.However front end layer is no longer confined to lightweight UI and graphics.Instead,with Single Page Applications(SPA),you can have pretty much an entire application running on browser(serverless).

In this blog, we will be going to cover following aspects –

What’s a web component?
What is LWC and how is it different then “Aura Components” what was previously known as “Lightning Components”
Benefits of using LWC
Open Question
Where to start learning LWC

What is Web Components:

Web Component was a set of different technologies allowing you to create durable custom elements — with their functionality encapsulated away from the rest of your code — and apply them in to your web apps – Mozilla.

In short, prior to web components, one had to utilize an external library/ framework (like Angular, React etc.) and build your application on top of it. So essentially, your application runs on top of the external library/ framework and which in turn runs on the browser.

With latest innovations within web development world and addition of custom elements, shadow DOM (don’t confuse with virtual DOM), and content template element, browsers are now equipped to execute custom web components themselves, without needing any external library.

It can be related to running a video using HTML video component vs using Adobe Flash for running videos (not quite literally).

LWC is a New Programming Model:

Lightning Web Component is a brand new lightweight framework built on web standards. You must be wondering about web standards team and why is it being so important for Lightning Web Components then I must tell you that “Web standards are rules and guidelines established by the World Wide Web Consortium (W3C) developed to promote consistency in the design code which makes up a web page. Without getting technical, simply it’s the guideline for the mark-up language which determines how a web page. displays in a visitor’s browser window.” Since, Salesforce is committed to developing open web standards and is a member of the World Wide Web Consortium (W3C), it has become important encouraging development around web standards on Lightning Platform.

Lightning Web Component (LWC) is quite similar to the Aura Components (Originally Lightning Components) when it comes to look and feel but both are different at architecture level. LWC uses modern web programming models and everything which is provided by the browser’s API as part of web standards. On the other side, Aura Components has their own programming standards and component model. Lightning web components use native JavaScript and HTML components along with optional CSS to render layouts on the page. Since most of the feature implemented natively with the help of browser supported APIs LWC are faster when it comes to the performance. It leverages custom elements, templates, shadow DOM, decorators, modules, and other new language constructs available in ECMAScript 7 and beyond.

Since, everything render on the client side with the support of browser APIs, LWC is faster compared to Aura Components and significantly removes poor performance due to rendering delays. Lightning web components and Aura components can be used in the same lightning app as both can talk to each-other and can deliver exceptional performance. As you know JavaScript is used in 95% of all websites so it gives the flexibility to a company who has shortage of lightning developer talent today. Such companies can use experienced Javascript developers to start developing outstanding solutions on the Salesforce Lightning Platform.

Why should I switch to LWC programming model:

This is a question which I would love to answer. This question has become relevant to every developer / Salesforce partner after release of this one more new programming model for Salesforce development. Salesforce customers who were planning to roll-out Lightning Experience in their Salesforce org had plans to convert Visualforce pages and components into Aura Components but now they are wondering why is this new LWC launched when they already had Aura Frameworks. Do they need to revisit their plans to switch to Lightning Web Components? Here is the answer of your question –

If you have already converted VF pages and components into Aura Framework then stick with it for now and Use Lightning web components for new components only.
If you have a long way to go and just started on this path then switching to web components would be a wise decision.
If you’r seeing any performance issues with existing work mainly in rendering delays then, LWC could be a good bet.

Benefits of using LWC:

If you have been doing development on React.js and an expert in JavaScript then I think you already know the benefits of using LWC in the Salesforce development. But someone who just started with Aura Components and looking out for the information around LWC then you should check the following facts –

Lightning Web Components (LWC) used HTML5, ES6, CSS3 which utilise browser APIs for rendering the UI and it give users a seamless experience.
Web components use browser’s native API support to render UI which reduces the overheads of using other JS libraries and CSS.

You can compose Aura components from Lightning web components, but not the other way around.

Open Questions:

There are still some unanswered questions here:

As we know Lightning Experience itself is built on top of Aura framework. Is Salesforce planning to re-write entire Lightning experience with newer Lightning web components? I’m sure the additional performance and memory efficiency will be more than welcome.
Would lightning web components become latest de-facto of publishing packages on AppExchange?
More importantly, with server side rendering of visualforce pages and client side handling of lightning web components, can there is a mixed model to utilize best of both the worlds?
Most important, would it help load lightning experience home page faster? (pun intended)

Thanks For the Reading www.varianceinfotech.com

Do You Need more information ?

For any further information / query regarding Technology, please email us at info@varianceinfotech.com OR call us on +1 630 861 8263, Alternately you can request for information by filling up Contact Us