diff --git a/packages/start/islands/index.tsx b/packages/start/islands/index.tsx
index 5913feb9b..8c7d03bd1 100644
--- a/packages/start/islands/index.tsx
+++ b/packages/start/islands/index.tsx
@@ -1,15 +1,13 @@
-import { Component, ComponentProps, lazy, sharedConfig } from "solid-js";
+import { Component, ComponentProps, createUniqueId, lazy, sharedConfig } from "solid-js";
 import { Hydration, NoHydration } from "solid-js/web";
 import { useRequest } from "../server/ServerContext";
 import { IslandManifest } from "../server/types";
-import { splitProps } from "./utils";
 export { default as clientOnly } from "./clientOnly";
 
 declare module "solid-js" {
   namespace JSX {
     interface IntrinsicElements {
       "solid-island": {
-        "data-props": string;
         "data-component": string;
         "data-island": string;
         "data-when": "idle" | "load";
@@ -45,11 +43,9 @@ export function island<T extends Component<any>>(
     );
   }
 
-  return ((compProps: ComponentProps<T>) => {
+  return ((props: ComponentProps<T>) => {
     if (import.meta.env.SSR) {
       const context = useRequest();
-      const [, props] = splitProps(compProps, ["children"] as any);
-      const [, spreadProps] = splitProps(compProps, [] as any);
 
       let fpath: string;
       let styles: string[] = [];
@@ -64,42 +60,35 @@ export function island<T extends Component<any>>(
         fpath = path;
       }
 
-      const serialize = (props: ComponentProps<T>) => {
-        let offset = 0;
-        let el = JSON.stringify(props, (key, value) => {
-          if (value && value.t) {
-            offset++;
-            return undefined;
-          }
-          return value;
-        });
-
-        return {
-          "data-props": el,
-          "data-offset": offset
-        };
-      };
-
       // @ts-expect-error
       if (!sharedConfig.context?.noHydrate) {
-        return <Component {...compProps} />;
+        return <Component {...props} />;
       }
 
+      // FIXME Introduce a new ID generation scheme
+      // for islands
+      const id = createUniqueId();
+
+      sharedConfig.context.serialize(
+        id,
+        props,
+      );
+      
+
       return (
         <Hydration>
           <solid-island
+            data-id={id}
             data-component={fpath!}
             data-island={path}
             data-when={(props as any)["client:idle"] ? "idle" : "load"}
             data-css={JSON.stringify(styles)}
-            {...serialize(props)}
           >
-            <IslandComponent {...spreadProps} />
+            <IslandComponent {...props} />
           </solid-island>
         </Hydration>
       );
-    } else {
-      return <Component {...compProps} />;
     }
+    return <Component {...props} />;
   }) as T;
 }
diff --git a/packages/start/islands/mount.tsx b/packages/start/islands/mount.tsx
index 5e49995cd..8264101a4 100644
--- a/packages/start/islands/mount.tsx
+++ b/packages/start/islands/mount.tsx
@@ -21,7 +21,7 @@ export function hydrateServerRouter() {
     if (!Component || !el.dataset.hk) return;
 
     let hk = el.dataset.hk;
-    _$DEBUG("hydrating island", el.dataset.island, hk.slice(0, hk.length - 1) + `1-`, el);
+    // _$DEBUG("hydrating island", el.dataset.island, hk.slice(0, hk.length - 1) + `1-`, el);
 
     let props = createStore({
       ...JSON.parse(el.dataset.props!),
@@ -38,7 +38,7 @@ export function hydrateServerRouter() {
     map.set(el, props);
 
     hydrate(() => createComponent(Component, props[0]), el, {
-      renderId: hk.slice(0, hk.length - 1) + `${1 + Number(el.dataset.offset)}-`,
+      renderId: el.dataset.id,
       owner: lookupOwner(el)
     });