diff --git a/dune-project b/dune-project
index 335194ae48..1194593485 100644
--- a/dune-project
+++ b/dune-project
@@ -29,13 +29,12 @@
   reason
   ppx_yojson_conv_lib
   ppx_yojson_conv
-  incr_dom
   (omd (>= 2.0.0~alpha4))
   ezjs_idb
-  virtual_dom
+  bonsai
   ppx_deriving
   ptmap
-  uuidm
+  (uuidm (= 0.9.8)) ; 0.9.9 has breaking deprecated changes
   unionFind
   ocamlformat
   (junit_alcotest :with-test)
diff --git a/dune-workspace b/dune-workspace
new file mode 100644
index 0000000000..480ccb1514
--- /dev/null
+++ b/dune-workspace
@@ -0,0 +1,9 @@
+(lang dune 3.16)
+
+(env
+ (dev
+  (flags
+   (:standard -warn-error -A)))
+ (release
+  (flags
+   (:standard -warn-error +A-58))))
diff --git a/hazel.opam b/hazel.opam
index 36a81b933a..e78b188325 100644
--- a/hazel.opam
+++ b/hazel.opam
@@ -14,13 +14,12 @@ depends: [
   "reason"
   "ppx_yojson_conv_lib"
   "ppx_yojson_conv"
-  "incr_dom"
   "omd" {>= "2.0.0~alpha4"}
   "ezjs_idb"
-  "virtual_dom"
+  "bonsai"
   "ppx_deriving"
   "ptmap"
-  "uuidm"
+  "uuidm" {= "0.9.8"}
   "unionFind"
   "ocamlformat"
   "junit_alcotest" {with-test}
diff --git a/hazel.opam.locked b/hazel.opam.locked
index 31fd8b2c15..b2cfce2cea 100644
--- a/hazel.opam.locked
+++ b/hazel.opam.locked
@@ -1,7 +1,7 @@
 
 opam-version: "2.0"
 name: "hazel"
-version: "~dev"
+version: "dev"
 synopsis: "Hazel, a live functional programming environment with typed holes"
 maintainer: "Hazel Development Team"
 authors: "Hazel Development Team"
@@ -11,11 +11,19 @@ bug-reports: "https://github.com/hazelgrove/hazel/issues"
 depends: [
   "abstract_algebra" {= "v0.16.0"}
   "alcotest" {= "1.8.0" & with-test}
-  "angstrom" {= "0.16.0"}
+  "angstrom" {= "0.16.1"}
   "astring" {= "0.8.5"}
+  "async" {= "v0.16.0"}
+  "async_durable" {= "v0.16.0"}
+  "async_extra" {= "v0.16.0"}
   "async_js" {= "v0.16.0"}
   "async_kernel" {= "v0.16.0"}
   "async_rpc_kernel" {= "v0.16.0"}
+  "async_rpc_websocket" {= "v0.16.0"}
+  "async_ssl" {= "v0.16.1"}
+  "async_unix" {= "v0.16.0"}
+  "async_websocket" {= "v0.16.0"}
+  "babel" {= "v0.16.0"}
   "base" {= "v0.16.3"}
   "base-bigarray" {= "base"}
   "base-bytes" {= "base"}
@@ -26,85 +34,117 @@ depends: [
   "base64" {= "3.5.1"}
   "base_bigstring" {= "v0.16.0"}
   "base_quickcheck" {= "v0.16.0"}
+  "bigarray-compat" {= "1.1.0"}
   "bignum" {= "v0.16.0"}
-  "bigstringaf" {= "0.9.1"}
+  "bigstringaf" {= "0.10.0"}
   "bin_prot" {= "v0.16.0"}
+  "bonsai" {= "v0.16.0"}
   "camlp-streams" {= "5.0.1"}
   "chrome-trace" {= "3.16.0"}
   "cmdliner" {= "1.3.0"}
+  "cohttp" {= "5.3.1"}
+  "cohttp-async" {= "5.3.0"}
+  "cohttp_async_websocket" {= "v0.16.0"}
+  "conduit" {= "7.1.0"}
+  "conduit-async" {= "7.1.0"}
   "conf-bash" {= "1"}
   "conf-gmp" {= "4"}
+  "conf-gmp-powm-sec" {= "3"}
+  "conf-libffi" {= "2.0.0"}
+  "conf-libssl" {= "4"}
+  "conf-pkg-config" {= "3"}
+  "conf-zlib" {= "1"}
   "core" {= "v0.16.2"}
+  "core_bench" {= "v0.16.0"}
   "core_kernel" {= "v0.16.0"}
-  "cppo" {= "1.6.9"}
+  "core_unix" {= "v0.16.0"}
+  "cppo" {= "1.7.0"}
   "crunch" {= "3.3.1" & with-doc}
+  "cryptokit" {= "1.16.1"}
   "csexp" {= "1.5.2"}
+  "ctypes" {= "0.23.0"}
+  "ctypes-foreign" {= "0.23.0"}
   "diffable" {= "v0.16.0"}
+  "domain-name" {= "0.4.0"}
   "dune" {= "3.16.0"}
   "dune-build-info" {= "3.16.0"}
   "dune-configurator" {= "3.16.0"}
   "dune-rpc" {= "3.16.0"}
   "dyn" {= "3.16.0"}
   "either" {= "1.0.0"}
+  "expect_test_helpers_core" {= "v0.16.0"}
   "ezjs_idb" {= "0.1.1"}
   "ezjs_min" {= "0.3.0"}
   "fiber" {= "3.7.0"}
   "fieldslib" {= "v0.16.0"}
   "fix" {= "20230505"}
-  "fmt" {= "0.9.0" & with-test}
+  "fmt" {= "0.9.0"}
   "fpath" {= "0.7.3"}
+  "fuzzy_match" {= "v0.16.0"}
   "gen" {= "1.1"}
-  "gen_js_api" {= "1.1.2"}
+  "gen_js_api" {= "1.1.3"}
   "incr_dom" {= "v0.16.0"}
   "incr_map" {= "v0.16.0"}
   "incr_select" {= "v0.16.0"}
   "incremental" {= "v0.16.1"}
+  "indentation_buffer" {= "v0.16.0"}
   "int_repr" {= "v0.16.0"}
+  "integers" {= "0.7.0"}
+  "ipaddr" {= "5.6.0"}
+  "ipaddr-sexp" {= "5.6.0"}
   "jane-street-headers" {= "v0.16.0"}
   "janestreet_lru_cache" {= "v0.16.1"}
   "js_of_ocaml" {= "5.8.2"}
   "js_of_ocaml-compiler" {= "5.8.2"}
   "js_of_ocaml-ppx" {= "5.8.2"}
   "js_of_ocaml_patches" {= "v0.16.0"}
+  "jsonm" {= "1.0.2"}
   "jsonrpc" {= "1.19.0"}
   "jst-config" {= "v0.16.0"}
   "junit" {= "2.0.2" & with-test}
   "junit_alcotest" {= "2.0.2" & with-test}
-  "lambdasoup" {= "1.0.0"}
+  "lambdasoup" {= "1.1.1"}
+  "logs" {= "0.7.0"}
   "lsp" {= "1.19.0"}
-  "lwt" {= "5.7.0"}
+  "macaddr" {= "5.6.0"}
+  "magic-mime" {= "1.3.1"}
   "markup" {= "1.0.3"}
-  "menhir" {= "20231231"}
-  "menhirCST" {= "20231231"}
-  "menhirLib" {= "20231231"}
-  "menhirSdk" {= "20231231"}
+  "menhir" {= "20240715"}
+  "menhirCST" {= "20240715"}
+  "menhirLib" {= "20240715"}
+  "menhirSdk" {= "20240715"}
   "merlin-extend" {= "0.6.1"}
-  "merlin-lib" {= "5.1-502"}
-  "num" {= "1.5"}
+  "merlin-lib" {= "5.2.1-502"}
+  "num" {= "1.5-1"}
   "ocaml" {= "5.2.0"}
   "ocaml-base-compiler" {= "5.2.0"}
   "ocaml-compiler-libs" {= "v0.17.0"}
   "ocaml-config" {= "3"}
-  "ocaml-index" {= "1.0"}
+  "ocaml-embed-file" {= "v0.16.0"}
+  "ocaml-index" {= "1.1"}
   "ocaml-lsp-server" {= "1.19.0"}
   "ocaml-options-vanilla" {= "1"}
   "ocaml-syntax-shims" {= "1.0.0"}
-  "ocaml-version" {= "3.6.7"}
-  "ocamlbuild" {= "0.14.3"}
+  "ocaml-version" {= "3.6.9"}
+  "ocaml_intrinsics" {= "v0.16.1"}
+  "ocamlbuild" {= "0.15.0"}
   "ocamlc-loc" {= "3.16.0"}
   "ocamlfind" {= "1.9.6"}
   "ocamlformat" {= "0.26.2"}
   "ocamlformat-lib" {= "0.26.2"}
   "ocamlformat-rpc-lib" {= "0.26.2"}
   "ocp-indent" {= "1.8.1"}
-  "ocplib-endian" {= "1.2"}
   "octavius" {= "1.2.2"}
-  "odoc" {= "2.4.2" & with-doc}
-  "odoc-parser" {= "2.4.2" & with-doc}
-  "ojs" {= "1.1.2"}
+  "odoc" {= "2.4.3" & with-doc}
+  "odoc-parser" {= "2.4.3" & with-doc}
+  "ojs" {= "1.1.3"}
   "omd" {= "2.0.0~alpha4"}
   "ordering" {= "3.16.0"}
+  "ordinal_abbreviation" {= "v0.16.0"}
   "parsexp" {= "v0.16.0"}
+  "patdiff" {= "v0.16.1"}
+  "patience_diff" {= "v0.16.0"}
+  "polling_state_rpc" {= "v0.16.0"}
   "pp" {= "1.2.0"}
   "ppx_assert" {= "v0.16.0"}
   "ppx_base" {= "v0.16.0"}
@@ -112,6 +152,7 @@ depends: [
   "ppx_bin_prot" {= "v0.16.0"}
   "ppx_cold" {= "v0.16.0"}
   "ppx_compare" {= "v0.16.0"}
+  "ppx_css" {= "v0.16.0"}
   "ppx_custom_printf" {= "v0.16.0"}
   "ppx_derivers" {= "1.2.1"}
   "ppx_deriving" {= "6.0.2"}
@@ -141,19 +182,24 @@ depends: [
   "ppx_stable_witness" {= "v0.16.0"}
   "ppx_string" {= "v0.16.0"}
   "ppx_tydi" {= "v0.16.0"}
+  "ppx_typed_fields" {= "v0.16.0"}
   "ppx_typerep_conv" {= "v0.16.0"}
   "ppx_variants_conv" {= "v0.16.0"}
   "ppx_yojson_conv" {= "v0.16.0"}
   "ppx_yojson_conv_lib" {= "v0.16.0"}
-  "ppxlib" {= "0.32.1"}
+  "ppxlib" {= "0.33.0"}
+  "profunctor" {= "v0.16.0"}
   "protocol_version_header" {= "v0.16.0"}
-  "ptime" {= "1.1.0" & with-test}
+  "ptime" {= "1.2.0" & with-test}
   "ptmap" {= "2.0.5"}
-  "re" {= "1.11.0"}
+  "re" {= "1.12.0"}
   "reason" {= "3.12.0"}
+  "record_builder" {= "v0.16.0"}
   "result" {= "1.5"}
   "sedlex" {= "3.2"}
   "seq" {= "base"}
+  "sexp_grammar" {= "v0.16.0"}
+  "sexp_pretty" {= "v0.16.0"}
   "sexplib" {= "v0.16.0"}
   "sexplib0" {= "v0.16.0"}
   "spawn" {= "v0.15.1"}
@@ -164,7 +210,11 @@ depends: [
   "stored_reversed" {= "v0.16.0"}
   "streamable" {= "v0.16.1"}
   "stringext" {= "1.6.0"}
+  "textutils" {= "v0.16.0"}
+  "textutils_kernel" {= "v0.16.0"}
+  "tilde_f" {= "v0.16.0"}
   "time_now" {= "v0.16.0"}
+  "timezone" {= "v0.16.0"}
   "topkg" {= "1.0.7"}
   "typerep" {= "v0.16.0"}
   "tyxml" {= "4.6.0"}
@@ -172,16 +222,16 @@ depends: [
   "unionFind" {= "20220122"}
   "uri" {= "4.4.0"}
   "uri-sexp" {= "4.4.0"}
-  "uucp" {= "15.1.0"}
+  "uucp" {= "16.0.0"}
   "uuidm" {= "0.9.8"}
-  "uunf" {= "15.1.0"}
-  "uuseg" {= "15.1.0"}
+  "uunf" {= "16.0.0"}
+  "uuseg" {= "16.0.0"}
   "uutf" {= "1.0.3"}
   "variantslib" {= "v0.16.0"}
   "virtual_dom" {= "v0.16.0"}
   "xdg" {= "3.16.0"}
   "yojson" {= "2.2.2"}
-  "zarith" {= "1.13"}
+  "zarith" {= "1.14"}
   "zarith_stubs_js" {= "v0.16.1"}
 ]
 build: [
diff --git a/src/haz3lweb/Keyboard.re b/src/haz3lweb/Keyboard.re
index f0501a66a4..7e4e655f26 100644
--- a/src/haz3lweb/Keyboard.re
+++ b/src/haz3lweb/Keyboard.re
@@ -227,7 +227,7 @@ let shortcuts = (sys: Key.sys): list(shortcut) =>
   ]
   @ (if (ExerciseSettings.show_instructor) {instructor_shortcuts} else {[]});
 
-let handle_key_event = (k: Key.t): option(Update.t) => {
+let handle_key_event = (k: Key.t): option(UpdateAction.t) => {
   let now = (a: Action.t): option(UpdateAction.t) =>
     Some(PerformAction(a));
   switch (k) {
diff --git a/src/haz3lweb/Log.re b/src/haz3lweb/Log.re
index 4d98345dab..7c87a640f6 100644
--- a/src/haz3lweb/Log.re
+++ b/src/haz3lweb/Log.re
@@ -12,7 +12,8 @@ let is_action_logged: UpdateAction.t => bool =
   | FinishImportAll(_)
   | FinishImportScratchpad(_)
   | Benchmark(_)
-  | DebugConsole(_) => false
+  | DebugConsole(_)
+  | Startup => false
   | Reset
   | TAB
   | Set(_)
diff --git a/src/haz3lweb/Main.re b/src/haz3lweb/Main.re
index cf0269bf45..af8058b770 100644
--- a/src/haz3lweb/Main.re
+++ b/src/haz3lweb/Main.re
@@ -1,29 +1,12 @@
 open Util;
 open Js_of_ocaml;
-open Incr_dom;
 open Haz3lweb;
+open Bonsai.Let_syntax;
 
 let scroll_to_caret = ref(true);
 let edit_action_applied = ref(true);
 let last_edit_action = ref(JsUtil.timestamp());
 
-let observe_font_specimen = (id, update) =>
-  ResizeObserver.observe(
-    ~node=JsUtil.get_elem_by_id(id),
-    ~f=
-      (entries, _) => {
-        let specimen = Js.to_array(entries)[0];
-        let rect = specimen##.contentRect;
-        update(
-          Haz3lweb.FontMetrics.{
-            row_height: rect##.bottom -. rect##.top,
-            col_width: rect##.right -. rect##.left,
-          },
-        );
-      },
-    (),
-  );
-
 let restart_caret_animation = () =>
   // necessary to trigger reflow
   // <https://css-tricks.com/restart-css-animation/>
@@ -36,7 +19,7 @@ let restart_caret_animation = () =>
   | _ => ()
   };
 
-let apply = (model, action, state, ~schedule_action): Model.t => {
+let apply = (model, action, ~schedule_action): Model.t => {
   restart_caret_animation();
   if (UpdateAction.is_edit(action)) {
     last_edit_action := JsUtil.timestamp();
@@ -48,7 +31,7 @@ let apply = (model, action, state, ~schedule_action): Model.t => {
   last_edit_action := JsUtil.timestamp();
   switch (
     try({
-      let new_model = Update.apply(model, action, state, ~schedule_action);
+      let new_model = Update.apply(model, action, ~schedule_action);
       Log.update(action);
       new_model;
     }) {
@@ -70,74 +53,63 @@ let apply = (model, action, state, ~schedule_action): Model.t => {
   };
 };
 
-module App = {
-  module Model = Model;
-  module Action = Update;
-  module State = State;
-
-  let on_startup = (~schedule_action, m: Model.t) => {
-    let _ =
-      observe_font_specimen("font-specimen", fm =>
-        schedule_action(Haz3lweb.Update.SetMeta(FontMetrics(fm)))
-      );
-
-    NinjaKeys.initialize(NinjaKeys.options(schedule_action));
-    JsUtil.focus_clipboard_shim();
-
-    /* initialize state. */
-    let state = State.init();
-
-    /* Initial evaluation on a worker */
-    Update.schedule_evaluation(~schedule_action, m);
+let app =
+  Bonsai.state_machine0(
+    (module Model),
+    (module Update),
+    ~apply_action=
+      (~inject, ~schedule_event) =>
+        apply(~schedule_action=x => schedule_event(inject(x))),
+    ~default_model=Model.load(Model.blank),
+  );
 
-    Os.is_mac :=
-      Dom_html.window##.navigator##.platform##toUpperCase##indexOf(
-        Js.string("MAC"),
-      )
-      >= 0;
-    Async_kernel.Deferred.return(state);
+/* This subcomponent is used to run an effect once when the app starts up,
+   After the first draw */
+let on_startup = effect => {
+  let%sub startup_completed = Bonsai.toggle'(~default_model=false);
+  let%sub after_display = {
+    switch%sub (startup_completed) {
+    | {state: false, set_state, _} =>
+      let%arr effect = effect
+      and set_state = set_state;
+      Bonsai.Effect.Many([set_state(true), effect]);
+    | {state: true, _} => Bonsai.Computation.return(Ui_effect.Ignore)
+    };
   };
+  Bonsai.Edge.after_display(after_display);
+};
 
-  let create =
-      (
-        model: Incr.t(Haz3lweb.Model.t),
-        ~old_model as _: Incr.t(Haz3lweb.Model.t),
-        ~inject,
-      ) => {
-    open Incr.Let_syntax;
-    let%map model = model;
-    /* Note: mapping over the old_model here may
-       trigger an additional redraw */
-    Component.create(
-      ~apply_action=apply(model),
-      model,
-      Haz3lweb.Page.view(~inject, model),
-      ~on_display=(_, ~schedule_action) => {
-        if (edit_action_applied^
-            && JsUtil.timestamp()
-            -. last_edit_action^ > 1000.0) {
-          /* If an edit action has been applied, but no other edit action
-             has been applied for 1 second, save the model. */
-          edit_action_applied := false;
-          print_endline("Saving...");
-          schedule_action(Update.Save);
-        };
-        if (scroll_to_caret.contents) {
-          scroll_to_caret := false;
-          JsUtil.scroll_cursor_into_view_if_needed();
-        };
-      },
+let view = {
+  let%sub app = app;
+  let%sub () = {
+    on_startup(
+      Bonsai.Value.map(~f=((_model, inject)) => inject(Startup), app),
     );
   };
+  let%sub after_display = {
+    let%arr (_model, inject) = app;
+    if (scroll_to_caret.contents) {
+      scroll_to_caret := false;
+      JsUtil.scroll_cursor_into_view_if_needed();
+    };
+    if (edit_action_applied^
+        && JsUtil.timestamp()
+        -. last_edit_action^ > 1000.0) {
+      /* If an edit action has been applied, but no other edit action
+         has been applied for 1 second, save the model. */
+      edit_action_applied := false;
+      print_endline("Saving...");
+      inject(Update.Save);
+    } else {
+      Ui_effect.Ignore;
+    };
+  };
+  let%sub () = Bonsai.Edge.after_display(after_display);
+  let%arr (model, inject) = app;
+  Haz3lweb.Page.view(~inject, model);
 };
 
 switch (JsUtil.Fragment.get_current()) {
 | Some("debug") => DebugMode.go()
-| _ =>
-  Incr_dom.Start_app.start(
-    (module App),
-    ~debug=false,
-    ~bind_to_element_with_id="container",
-    ~initial_model=Model.load(Model.blank),
-  )
+| _ => Bonsai_web.Start.start(view, ~bind_to_element_with_id="container")
 };
diff --git a/src/haz3lweb/Model.re b/src/haz3lweb/Model.re
index 839c07a0c8..e4939b3af0 100644
--- a/src/haz3lweb/Model.re
+++ b/src/haz3lweb/Model.re
@@ -33,6 +33,7 @@ let ui_state_init = {
   mousedown: false,
 };
 
+[@deriving sexp]
 type t = {
   editors: Editors.t,
   settings: Settings.t,
@@ -41,7 +42,7 @@ type t = {
   ui_state,
 };
 
-let cutoff = (===);
+let equal = (===);
 
 let mk = (editors, results) => {
   editors,
diff --git a/src/haz3lweb/Update.re b/src/haz3lweb/Update.re
index de814c4561..1aacb159f3 100644
--- a/src/haz3lweb/Update.re
+++ b/src/haz3lweb/Update.re
@@ -1,8 +1,26 @@
 open Util;
+open Js_of_ocaml;
 open Haz3lcore;
 
 include UpdateAction; // to prevent circularity
 
+let observe_font_specimen = (id, update) =>
+  ResizeObserver.observe(
+    ~node=JsUtil.get_elem_by_id(id),
+    ~f=
+      (entries, _) => {
+        let specimen = Js.to_array(entries)[0];
+        let rect = specimen##.contentRect;
+        update(
+          FontMetrics.{
+            row_height: rect##.bottom -. rect##.top,
+            col_width: rect##.right -. rect##.left,
+          },
+        );
+      },
+    (),
+  );
+
 let update_settings =
     (a: settings_action, {settings, _} as model: Model.t): Model.t =>
   switch (a) {
@@ -213,6 +231,25 @@ let schedule_evaluation = (~schedule_action, model: Model.t): unit =>
     };
   };
 
+let on_startup =
+    (~schedule_action: UpdateAction.t => unit, m: Model.t): Model.t => {
+  let _ =
+    observe_font_specimen("font-specimen", fm =>
+      schedule_action(UpdateAction.SetMeta(FontMetrics(fm)))
+    );
+  NinjaKeys.initialize(NinjaKeys.options(schedule_action));
+  JsUtil.focus_clipboard_shim();
+  /* initialize state. */
+  /* Initial evaluation on a worker */
+  schedule_evaluation(~schedule_action, m);
+  Os.is_mac :=
+    Dom_html.window##.navigator##.platform##toUpperCase##indexOf(
+      Js.string("MAC"),
+    )
+    >= 0;
+  m;
+};
+
 let update_cached_data = (~schedule_action, update, m: Model.t): Model.t => {
   let update_dynamics = reevaluate_post_update(update);
   /* If we switch editors, or change settings which require statics
@@ -360,9 +397,7 @@ let ui_state_update =
   };
 };
 
-let apply =
-    (model: Model.t, update: t, _state: State.t, ~schedule_action)
-    : Result.t(Model.t) => {
+let apply = (model: Model.t, update: t, ~schedule_action): Result.t(Model.t) => {
   let perform_action = (model: Model.t, a: Action.t): Result.t(Model.t) => {
     switch (
       Editors.perform_action(~settings=model.settings.core, model.editors, a)
@@ -373,6 +408,7 @@ let apply =
   };
   let m: Result.t(Model.t) =
     switch (update) {
+    | Startup => Ok(on_startup(~schedule_action, model))
     | Reset => Ok(Model.reset(model))
     | Set(Evaluation(_) as s_action) => Ok(update_settings(s_action, model))
     | Set(s_action) =>
diff --git a/src/haz3lweb/UpdateAction.re b/src/haz3lweb/UpdateAction.re
index b67861090f..cd2f145f3e 100644
--- a/src/haz3lweb/UpdateAction.re
+++ b/src/haz3lweb/UpdateAction.re
@@ -57,6 +57,7 @@ type export_action =
 [@deriving (show({with_path: false}), sexp, yojson)]
 type t =
   /* meta */
+  | Startup
   | Reset
   | Set(settings_action)
   | SetMeta(set_meta)
@@ -144,7 +145,8 @@ let is_edit: t => bool =
   | DebugConsole(_)
   | InitImportAll(_)
   | InitImportScratchpad(_)
-  | Benchmark(_) => false;
+  | Benchmark(_)
+  | Startup => false;
 
 let reevaluate_post_update: t => bool =
   fun
@@ -197,7 +199,8 @@ let reevaluate_post_update: t => bool =
   | SwitchDocumentationSlide(_)
   | Reset
   | Undo
-  | Redo => true;
+  | Redo
+  | Startup => true;
 
 let should_scroll_to_caret =
   fun
@@ -235,7 +238,8 @@ let should_scroll_to_caret =
   | Reset
   | Undo
   | Redo
-  | TAB => true
+  | TAB
+  | Startup => true
   | PerformAction(a) =>
     switch (a) {
     | Move(_)
diff --git a/src/haz3lweb/dune b/src/haz3lweb/dune
index 8d25155dc5..d3e42ec636 100644
--- a/src/haz3lweb/dune
+++ b/src/haz3lweb/dune
@@ -9,7 +9,8 @@
  (name workerServer)
  (modules WorkerServer)
  (libraries
-  incr_dom
+  bonsai
+  bonsai.web
   virtual_dom.input_widgets
   util
   ppx_yojson_conv.expander
@@ -38,7 +39,8 @@
   ezjs_idb
   workerServer
   str
-  incr_dom
+  bonsai
+  bonsai.web
   virtual_dom.input_widgets
   util
   ppx_yojson_conv.expander
@@ -66,7 +68,8 @@
    js_of_ocaml-ppx
    ppx_let
    ppx_sexp_conv
-   ppx_deriving.show)))
+   ppx_deriving.show
+   bonsai.ppx_bonsai)))
 
 (executable
  (name worker)
diff --git a/src/haz3lweb/view/DebugMode.re b/src/haz3lweb/view/DebugMode.re
index 543e7cc757..39cba26eb8 100644
--- a/src/haz3lweb/view/DebugMode.re
+++ b/src/haz3lweb/view/DebugMode.re
@@ -48,35 +48,8 @@ let view = {
   );
 };
 
-module App = {
-  module Model = {
-    type t = unit;
-    let cutoff = (_, _) => false;
-  };
-  module Action = {
-    type t = unit;
-    let sexp_of_t = _ => Sexplib.Sexp.unit;
-  };
-  module State = {
-    type t = unit;
-  };
-  let on_startup = (~schedule_action as _, _) =>
-    Async_kernel.Deferred.return();
-  let create = (_, ~old_model as _, ~inject as _) =>
-    Incr_dom.Incr.return()
-    |> Incr_dom.Incr.map(~f=_ =>
-         Incr_dom.Component.create(
-           ~apply_action=(_, _, ~schedule_action as _) => (),
-           (),
-           view,
-         )
-       );
-};
-
 let go = () =>
-  Incr_dom.Start_app.start(
-    (module App),
-    ~debug=false,
+  Bonsai_web.Start.start(
+    Bonsai.Computation.return(view),
     ~bind_to_element_with_id="container",
-    ~initial_model=(),
   );
diff --git a/src/util/dune b/src/util/dune
index 889c95bd2c..a3494db579 100644
--- a/src/util/dune
+++ b/src/util/dune
@@ -1,6 +1,6 @@
 (library
  (name util)
- (libraries re base ptmap incr_dom virtual_dom yojson)
+ (libraries re base ptmap bonsai bonsai.web virtual_dom yojson)
  (js_of_ocaml)
  (preprocess
   (pps
@@ -12,8 +12,10 @@
 
 (env
  (dev
+  (flags :standard -warn-error -A)
   (js_of_ocaml
    (flags :standard --debuginfo --noinline --dynlink --linkall --sourcemap)))
  (release
+  (flags :standard -warn-error +A-58)
   (js_of_ocaml
    (flags :standard))))