Plan Your Experience Cloud Migration From Aura To Lightning Web Runtime

Lightning Web Runtime (LWR) is the future of Experience Cloud sites and Salesforce Communities. By moving your community to Lightning Web Runtime, you’ll unlock faster load times, more flexible design options, and greater scalability. However, migrating your site to LWR is similar to other tech migrations, where thoughtful planning, refactoring, and training are necessary.

Code Updates

The new runtime can serve both Lightning Web Components (LWC) and Visualforce pages. However, Aura components are not supported in LWR due to underlying differences between Aura and LWR runtime environments. Identify all Aura components used in your site and develop a plan to refactor these into LWC, using the new LWC features available in LWR, like responsive properties and data binding.

Lightning Web Components should also be analyzed to determine if new LWR features can be added to the components to increase performance, and to verify that components will not be impacted by current LWR limitations, although Salesforce releases more updates to LWR each release that reduce the amount of current LWR limitations.

URLs

When rebuilding pages from your Aura site in your new LWR site, it is best practice to keep the same base URL. For example, if you have a Contact Object list view page available at www.example.com/s/contacts use the same “/contacts” page URL in LWR.

This will make redirects easier to create and manage. LWR sites also do not append “/s” to your site. While this is a much-requested feature for community sites, be sure to check any links that will be directed to your new LWR site and make sure “/s/” is not used.

CSS

In LWR, Lightning Web Components use scoped CSS by default. Each component encapsulates its CSS within its shadow DOM, preventing styles from bleeding into other components. This ensures better encapsulation and reduces the likelihood of unintended CSS conflicts. The sitewide CSS editor available in Aura sites is no longer available in LWR, and any CSS there will need to be migrated to the new sfdc_cms__styles folder as part of the DigitalExperienceBundle metadata bundle, accessed by SFDX.

Templates

If your site makes use of standard Experience Builder templates, you’ll need to make a plan to convert your page layouts to Flexible Layouts. Flexible Layouts allow you to customize your page layout to your needs by allowing you to create and resize multiple columns as well as stacking and reordering sections.

Another part of your migration strategy will include assessing which out-of-the-box components from your Aura-based template will need to be rebuilt in LWR. Search bars are available out of the box in LWR, but components like profile menus and navigation menus will need to be rebuilt using Lightning Web Components.

Conclusion

Migrating your site from Aura to LWR is a great way to increase your site’s performance, future-proof your tech stack, and improve your user interface — but properly planning your migration is crucial to the success of your transition. If you’re interested in learning more about LWR, a Salesforce-certified partner like LaunchPad Lab can help you plan out your journey. Get in touch with our team today to learn more!

Matt Jackson

Developer

Matt is a skilled Salesforce expert specializing in building engaging communities on the Salesforce platform. After getting his start in video production, Matt transitioned to a career in Salesforce development to combine his love of creative problem solving with his passion for human centered design. Outside of work, Matt enjoys guitar, retro games and Sci-Fi novels.