After defining a Custom Element widget and placing it on a page, it is observed that the widget is loaded twice.
Sometimes this happens so fast that it is unnoticeable, other times a couple of seconds pass between the two renders.
In the browser console, the double rendering is visible at the first page load.
Environment
Quarterly Releases
Resolution
This is the intended behavior when Single Page Application (SPA) is enabled.
First the page loads, which leads to the first render. Then the SPA needs to index all the elements on the page, which will then cause the second render.
Not only custom, but out-of-the-box widgets get rendered twice. However, the out-of-the-box widgets' first render happens on the server's side, so the double rendering is not as noticeable.
Possible workarounds:
Disable SPA globally, via portal-ext.properties.
javascript.single.page.application.enabled=false
Disable SPA for a specific page:
At System Settings > Infrastructure > Frontend SPA Infrastructure, add the name of the page under Custom Excluded Paths
E.g., if the page is called Test, enter /Test
Ensure that the custom element defines a disconnect() callback to unmount it from the DOM and free any other used resources. (you may check our workspace samples)
