A critical vulnerability was discovered in React Server Components (Next.js). Our systems remain protected but we advise to update packages to newest version. Learn More

John-Philip Johansson
Mar 13, 2018
  4675
(2 votes)

"domUpdated" is no longer needed (BETA) (CMS UI 11.4.0)

You can read more about how you enable Beta features in the documentation.

In CMS UI 11.2.0 we introduced the "beta/domUpdated" message that refreshes the On-Page Editing (OPE) overlays. Based on feedback we received at presentations and on Github, we are now watching the view for changes to DOM elements with the "data-epi-property-name" property. You no longer need to do this:

epi.publish("beta/domUpdated")

If the DOM changes so that there are new elements with data-epi-property-name, or existing elements change their value to another property name, then the overlays automatically gets updated.

Previous considerations

As mentioned in the previous post, there were two reasons to introduce a message instead of automatically refreshing:

1. UI becomes unresponsive as the spamming is ongoing
2. Memory usage increases

There was also a third reason:

3. Giving you control of when to refresh, as to minimize 1 and 2.

But reason 3. seems like it just lead to boilerplate code that many would rather avoid, and we had already made changes to minimize the impact of 1. and 2., so when we got the question "can't it just 'work'?" we decided to make this change. The overlays will update by themselves now.

Image after.gif

Benefits

The main benefit is that it's now easier for a partner to make great client-side rendered UI's that still work nicely in OPE. That also makes our communication around features like this easier, because you don't have to do anything. cool 

Code on Github

Please contribute to these repos to help each other with how to work with OPE and your favourite JavaScript framework!

The example in our React sample repo has been updated to remove the "beta/domUpdated" code: https://github.com/episerver/AlloyReact

Please contribute an example to the AngularJS repo: https://github.com/episerver/AlloyAngularJS

Mar 13, 2018

Comments

Please login to comment.
Latest blogs
From 12 to 13 preview: A Developer's Guide to testing an Optimizely CMS 13 Alloy Site

The release of Optimizely CMS 13 marks a significant step forward, embracing a more composable and headless-first architecture. While this unlocks...

Robert Svallin | Jan 23, 2026

A day in the life of an Optimizely OMVP: Opti North Manchester - January 2026 Meetup Recap

There's something special about the Optimizely community in the North. On 22nd January, we gathered at the Everyman Cinema in Manchester for the...

Graham Carr | Jan 23, 2026

Beyond the widget - making Optimizely Content Recommendations work for you

Optimizely recommendation data you can render your way. A frontend-focused guide to bypassing the widget, with practical query filtering advise and...

Tom Robinson | Jan 22, 2026 |

Announcing the Jhoose Commerce API for Optimizely Commerce Connect

A layered framework for Optimizely Commerce Connect that accelerates delivery, supports headless architecture, and simplifies carts, checkout, and...

Andrew Markham | Jan 22, 2026 |