wip: ricraf polyfill

packages/web/examples/basic.rs

@@ -28,25 +28,6 @@ static APP: FC<()> = |cx| {
     cx.render(rsx! {
         div {
             button { onclick: move |_| count += 1, "add"  }
-            div {
-                div {
-                    div {
-                        div {
-                            div {
-                                Fragment {
-                                    a {"wo"}
-                                    p {"wo"}
-                                    li {"wo"}
-                                    em {"wo"}
-                                }
-                            }
-                        }
-                        Child {}
-                    }
-                    Child {}
-                }
-                Child {}
-            }
             ul {
                 {(0..*count).map(|f| rsx!{
                     li { "a - {f}" }
@@ -54,6 +35,7 @@ static APP: FC<()> = |cx| {
                     li { "c - {f}" }
                 })}
             }
+            Child {}
         }
     })
 };

packages/web/src/ric_raf.rs

@@ -29,6 +29,11 @@ impl RafLoop {
         let ric_closure: Closure<dyn Fn(JsValue)> =
             Closure::wrap(Box::new(move |v: JsValue| ric_sender.try_send(()).unwrap()));
 
+        // execute the polyfill for safari
+        Function::new_no_args(include_str!("./ricpolyfill.js"))
+            .call0(&JsValue::NULL)
+            .unwrap();
+
         Self {
             window: web_sys::window().unwrap(),
             raf_receiver,

packages/web/src/ricpolyfill.js

@@ -0,0 +1,28 @@
+const requestIdleCallback =
+  (typeof self !== 'undefined' &&
+    self.requestIdleCallback &&
+    self.requestIdleCallback.bind(window)) ||
+  function (cb) {
+    const start = Date.now();
+    return setTimeout(() => {
+      cb({
+        didTimeout: false,
+        timeRemaining: function () {
+          return Math.max(0, 50 - (Date.now() - start));
+        },
+      });
+    }, 1);
+  };
+
+const cancelIdleCallback =
+  (typeof self !== 'undefined' &&
+    self.cancelIdleCallback &&
+    self.cancelIdleCallback.bind(window)) ||
+  function (id) {
+    return clearTimeout(id);
+  };
+
+if (typeof window !== 'undefined') {
+  window.requestIdleCallback = requestIdleCallback;
+  window.cancelIdleCallback = cancelIdleCallback;
+}