Avoid re-appending views if order is unchanged (bokeh#14483)

* Avoid re-appending views if order is unchanged

* Fix lint

* Correctly determine existing order

* Use enumerate() instead of for-loop

---------

Co-authored-by: Mateusz Paprocki <[email protected]>

Author: philippjfr

bokehjs/src/lib/models/layouts/layout_dom.ts

@@ -6,6 +6,7 @@ import {Align, Dimensions, FlowMode, SizingMode} from "core/enums"
 import {px} from "core/dom"
 import type {Display, CSSStyles} from "core/css"
 import {isNumber, isArray} from "core/util/types"
+import {enumerate} from "core/util/iterator"
 import type * as p from "core/properties"
 
 import type {ViewStorage, IterViews} from "core/build_views"
@@ -156,15 +157,31 @@ export abstract class LayoutDOMView extends PaneView {
     const created = await this.build_child_views()
     const created_views = new Set(created)
 
+    // Find index up to which the order of the existing views
+    // matches the order of the new views. This allows us to
+    // skip re-inserting the views up to this point
+    const current_views = Array.from(this.shadow_el.children).flatMap(el => {
+      const view = this.child_views.find(view => view.el === el)
+      return view === undefined ? [] : [view]
+    })
+    let matching_index = null
+    for (let i = 0; i < current_views.length; i++) {
+      if (current_views[i] === this.child_views[i]) {
+        matching_index = i
+      } else {
+        break
+      }
+    }
+
     // Since appending to a DOM node will move the node to the end if it has
     // already been added appending all the children in order will result in
     // correct ordering.
-    for (const view of this.child_views) {
+    for (const [view, i] of enumerate(this.child_views)) {
       const is_new = created_views.has(view)
       const target = view.rendering_target() ?? this.self_target
       if (is_new) {
         view.render_to(target)
-      } else {
+      } else if (matching_index === null || i > matching_index) {
         target.append(view.el)
       }
     }