diff --git a/.gitignore b/.gitignore
index 321eccf8..a278eb27 100644
--- a/.gitignore
+++ b/.gitignore
@@ -69,6 +69,7 @@ packages/webgpu/cpp/dawn/
 packages/webgpu/cpp/webgpu/
 packages/webgpu/lib
 !packages/webgpu/scripts/build
+artifacts/
 
 
 # Cocoapods
diff --git a/apps/example/ios/Podfile.lock b/apps/example/ios/Podfile.lock
index 5812c23b..8abb3a8a 100644
--- a/apps/example/ios/Podfile.lock
+++ b/apps/example/ios/Podfile.lock
@@ -937,7 +937,7 @@ PODS:
     - React-debug
   - react-native-safe-area-context (4.11.0):
     - React-Core
-  - react-native-wgpu (0.1.9):
+  - react-native-wgpu (0.1.11):
     - DoubleConversion
     - glog
     - hermes-engine
@@ -1299,28 +1299,6 @@ PODS:
     - ReactCommon/turbomodule/bridging
     - ReactCommon/turbomodule/core
     - Yoga
-  - RNScreens (3.34.0):
-    - DoubleConversion
-    - glog
-    - hermes-engine
-    - RCT-Folly (= 2024.01.01.00)
-    - RCTRequired
-    - RCTTypeSafety
-    - React-Codegen
-    - React-Core
-    - React-debug
-    - React-Fabric
-    - React-featureflags
-    - React-graphics
-    - React-ImageManager
-    - React-NativeModulesApple
-    - React-RCTFabric
-    - React-RCTImage
-    - React-rendererdebug
-    - React-utils
-    - ReactCommon/turbomodule/bridging
-    - ReactCommon/turbomodule/core
-    - Yoga
   - SocketRocket (0.7.0)
   - Yoga (0.0.0)
 
@@ -1387,7 +1365,6 @@ DEPENDENCIES:
   - ReactTestApp-Resources (from `..`)
   - RNGestureHandler (from `../../../node_modules/react-native-gesture-handler`)
   - RNReanimated (from `../../../node_modules/react-native-reanimated`)
-  - RNScreens (from `../../../node_modules/react-native-screens`)
   - Yoga (from `../../../node_modules/react-native/ReactCommon/yoga`)
 
 SPEC REPOS:
@@ -1516,8 +1493,6 @@ EXTERNAL SOURCES:
     :path: "../../../node_modules/react-native-gesture-handler"
   RNReanimated:
     :path: "../../../node_modules/react-native-reanimated"
-  RNScreens:
-    :path: "../../../node_modules/react-native-screens"
   Yoga:
     :path: "../../../node_modules/react-native/ReactCommon/yoga"
 
@@ -1553,7 +1528,7 @@ SPEC CHECKSUMS:
   React-logger: 29fa3e048f5f67fe396bc08af7606426d9bd7b5d
   React-Mapbuffer: bf56147c9775491e53122a94c423ac201417e326
   react-native-safe-area-context: 851c62c48dce80ccaa5637b6aa5991a1bc36eca9
-  react-native-wgpu: e7e68e090306051c040faca3e53b0040641c954e
+  react-native-wgpu: f174e542dc510ff82b22709d8c1bec85b0f33d8f
   React-nativeconfig: 9f223cd321823afdecf59ed00861ab2d69ee0fc1
   React-NativeModulesApple: ff7efaff7098639db5631236cfd91d60abff04c0
   React-perflogger: 32ed45d9cee02cf6639acae34251590dccd30994
@@ -1582,7 +1557,6 @@ SPEC CHECKSUMS:
   ReactTestApp-Resources: 857244f3a23f2b3157b364fa06cf3e8866deff9c
   RNGestureHandler: 67e78f16895947f7e57ab91e75e914d3e9ef7239
   RNReanimated: 4c72fc2c0f4c6a9c36932e653cd68e4521b6c4ac
-  RNScreens: aa943ad421c3ced3ef5a47ede02b0cbfc43a012e
   SocketRocket: abac6f5de4d4d62d24e11868d7a2f427e0ef940d
   Yoga: ae3c32c514802d30f687a04a6a35b348506d411f
 
diff --git a/apps/example/package.json b/apps/example/package.json
index b8ea3413..a2722eb1 100644
--- a/apps/example/package.json
+++ b/apps/example/package.json
@@ -10,13 +10,13 @@
     "start": "react-native start",
     "pod:install": "pod install --project-directory=ios",
     "build:android": "cd android && ./gradlew assembleDebug --warning-mode all",
-    "build:ios": "yarn run mkdist && react-native bundle --entry-file index.js --platform ios --dev true --bundle-output dist/main.ios.jsbundle --assets-dest dist && react-native build-ios --scheme Example --mode Debug --extra-params \"-sdk iphonesimulator CC=clang CPLUSPLUS=clang++ LD=clang LDPLUSPLUS=clang++ GCC_OPTIMIZATION_LEVEL=0 GCC_PRECOMPILE_PREFIX_HEADER=YES ASSETCATALOG_COMPILER_OPTIMIZATION=time DEBUG_INFORMATION_FORMAT=dwarf COMPILER_INDEX_STORE_ENABLE=NO\"",
+    "build:ios": "react-native build-ios --scheme Example --mode Debug --extra-params \"-sdk iphonesimulator CC=clang CPLUSPLUS=clang++ LD=clang LDPLUSPLUS=clang++ GCC_OPTIMIZATION_LEVEL=0 GCC_PRECOMPILE_PREFIX_HEADER=YES ASSETCATALOG_COMPILER_OPTIMIZATION=time DEBUG_INFORMATION_FORMAT=dwarf COMPILER_INDEX_STORE_ENABLE=NO\"",
     "mkdist": "node -e \"require('node:fs').mkdirSync('dist', { recursive: true, mode: 0o755 })\""
   },
   "dependencies": {
     "@callstack/react-native-visionos": "^0.74.0",
     "@react-navigation/native": "^6.1.17",
-    "@react-navigation/native-stack": "^6.10.0",
+    "@react-navigation/stack": "^6.4.0",
     "@react-three/fiber": "^8.17.6",
     "fast-text-encoding": "^1.0.6",
     "react": "18.2.0",
@@ -25,7 +25,6 @@
     "react-native-macos": "^0.74.0",
     "react-native-reanimated": "^3.12.1",
     "react-native-safe-area-context": "^4.10.7",
-    "react-native-screens": "^3.32.0",
     "react-native-wgpu": "*",
     "teapot": "^1.0.0",
     "three": "0.168.0",
diff --git a/apps/example/src/App.tsx b/apps/example/src/App.tsx
index 9bdb1cd7..755ef5f2 100644
--- a/apps/example/src/App.tsx
+++ b/apps/example/src/App.tsx
@@ -1,5 +1,5 @@
 import { NavigationContainer } from "@react-navigation/native";
-import { createNativeStackNavigator } from "@react-navigation/native-stack";
+import { createStackNavigator } from "@react-navigation/stack";
 import { GestureHandlerRootView } from "react-native-gesture-handler";
 
 import type { Routes } from "./Route";
@@ -32,7 +32,7 @@ import { CanvasAPI } from "./CanvasAPI";
 import "fast-text-encoding";
 window.parent = window;
 
-const Stack = createNativeStackNavigator<Routes>();
+const Stack = createStackNavigator<Routes>();
 
 function App() {
   const assets = useAssets();
diff --git a/apps/example/src/Home.tsx b/apps/example/src/Home.tsx
index 6e2afa2f..a012deb0 100644
--- a/apps/example/src/Home.tsx
+++ b/apps/example/src/Home.tsx
@@ -2,7 +2,7 @@ import * as React from "react";
 import { Platform, ScrollView, StyleSheet, Text, View } from "react-native";
 import { useNavigation } from "@react-navigation/native";
 import { RectButton } from "react-native-gesture-handler";
-import type { NativeStackNavigationProp } from "@react-navigation/native-stack";
+import type { StackNavigationProp } from "@react-navigation/stack";
 
 import type { Routes } from "./Route";
 
@@ -116,7 +116,7 @@ const styles = StyleSheet.create({
 
 export const Home = () => {
   const { navigate } =
-    useNavigation<NativeStackNavigationProp<Routes, "Home">>();
+    useNavigation<StackNavigationProp<Routes, "Home">>();
   return (
     <ScrollView style={styles.container} contentContainerStyle={styles.content}>
       {examples.map((thumbnail) => (
diff --git a/apps/example/src/ThreeJS/List.tsx b/apps/example/src/ThreeJS/List.tsx
index 83dfe933..85477ac6 100644
--- a/apps/example/src/ThreeJS/List.tsx
+++ b/apps/example/src/ThreeJS/List.tsx
@@ -2,7 +2,7 @@ import * as React from "react";
 import { ScrollView, StyleSheet, Text, View } from "react-native";
 import { useNavigation } from "@react-navigation/native";
 import { RectButton } from "react-native-gesture-handler";
-import type { NativeStackNavigationProp } from "@react-navigation/native-stack";
+import type { StackNavigationProp } from "@react-navigation/stack";
 
 import type { Routes } from "./Routes";
 
@@ -43,8 +43,7 @@ const styles = StyleSheet.create({
 });
 
 export const List = () => {
-  const { navigate } =
-    useNavigation<NativeStackNavigationProp<Routes, "List">>();
+  const { navigate } = useNavigation<StackNavigationProp<Routes, "List">>();
   return (
     <ScrollView style={styles.container} contentContainerStyle={styles.content}>
       {examples.map((thumbnail) => (
diff --git a/apps/example/src/ThreeJS/index.tsx b/apps/example/src/ThreeJS/index.tsx
index e239de4c..6bf288ae 100644
--- a/apps/example/src/ThreeJS/index.tsx
+++ b/apps/example/src/ThreeJS/index.tsx
@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import { createNativeStackNavigator } from "@react-navigation/native-stack";
+import { createStackNavigator } from "@react-navigation/stack";
 import { warnIfNotHardwareAccelerated } from "react-native-wgpu";
 
 import { Cube } from "./Cube";
@@ -10,7 +10,7 @@ import { Backdrop } from "./Backdrop";
 import { InstancedMesh } from "./InstancedMesh";
 import { Fiber } from "./Fiber";
 
-const Stack = createNativeStackNavigator<Routes>();
+const Stack = createStackNavigator<Routes>();
 export const ThreeJS = () => {
   useEffect(() => {
     navigator.gpu.requestAdapter().then((adapter) => {
diff --git a/packages/webgpu/ios/IOSPlatformContext.h b/packages/webgpu/apple/ApplePlatformContext.h
similarity index 68%
rename from packages/webgpu/ios/IOSPlatformContext.h
rename to packages/webgpu/apple/ApplePlatformContext.h
index 2b5b7598..edb9f512 100644
--- a/packages/webgpu/ios/IOSPlatformContext.h
+++ b/packages/webgpu/apple/ApplePlatformContext.h
@@ -4,10 +4,10 @@
 
 namespace rnwgpu {
 
-class IOSPlatformContext : public PlatformContext {
+class ApplePlatformContext : public PlatformContext {
 public:
-  IOSPlatformContext() = default;
-  ~IOSPlatformContext() = default;
+  ApplePlatformContext() = default;
+  ~ApplePlatformContext() = default;
 
   wgpu::Surface makeSurface(wgpu::Instance instance, void *surface, int width,
                             int height) override;
@@ -16,4 +16,4 @@ class IOSPlatformContext : public PlatformContext {
                               double size) override;
 };
 
-} // namespace rnwgpu
\ No newline at end of file
+} // namespace rnwgpu
diff --git a/packages/webgpu/ios/IOSPlatformContext.mm b/packages/webgpu/apple/ApplePlatformContext.mm
similarity index 92%
rename from packages/webgpu/ios/IOSPlatformContext.mm
rename to packages/webgpu/apple/ApplePlatformContext.mm
index cd3754f7..57706a3a 100644
--- a/packages/webgpu/ios/IOSPlatformContext.mm
+++ b/packages/webgpu/apple/ApplePlatformContext.mm
@@ -1,4 +1,4 @@
-#include "IOSPlatformContext.h"
+#include "ApplePlatformContext.h"
 
 #import <React/RCTBlobManager.h>
 #import <React/RCTBridge+Private.h>
@@ -9,7 +9,7 @@
 
 namespace rnwgpu {
 
-wgpu::Surface IOSPlatformContext::makeSurface(wgpu::Instance instance,
+wgpu::Surface ApplePlatformContext::makeSurface(wgpu::Instance instance,
                                               void *surface, int width,
                                               int height) {
   wgpu::SurfaceDescriptorFromMetalLayer metalSurfaceDesc;
@@ -19,7 +19,7 @@
   return instance.CreateSurface(&surfaceDescriptor);
 }
 
-ImageData IOSPlatformContext::createImageBitmap(std::string blobId,
+ImageData ApplePlatformContext::createImageBitmap(std::string blobId,
                                                 double offset, double size) {
   RCTBlobManager *blobManager =
       [[RCTBridge currentBridge] moduleForClass:RCTBlobManager.class];
diff --git a/packages/webgpu/ios/MetalView.h b/packages/webgpu/apple/MetalView.h
similarity index 78%
rename from packages/webgpu/ios/MetalView.h
rename to packages/webgpu/apple/MetalView.h
index 0db33809..373a30da 100644
--- a/packages/webgpu/ios/MetalView.h
+++ b/packages/webgpu/apple/MetalView.h
@@ -7,4 +7,7 @@
 
 @property NSNumber *contextId;
 
+- (void)configure;
+- (void)update;
+
 @end
diff --git a/packages/webgpu/apple/MetalView.mm b/packages/webgpu/apple/MetalView.mm
new file mode 100644
index 00000000..c2930e7d
--- /dev/null
+++ b/packages/webgpu/apple/MetalView.mm
@@ -0,0 +1,58 @@
+#import "MetalView.h"
+#import "webgpu_cpp.h"
+
+#ifndef RCT_NEW_ARCH_ENABLED
+#import <React/RCTViewManager.h>
+#endif //RCT_NEW_ARCH_ENABLED
+
+@implementation MetalView {
+  BOOL _isConfigured;
+}
+
++ (Class)layerClass {
+  return [CAMetalLayer class];
+}
+
+- (void)configure
+{
+  auto size = self.frame.size;
+  std::shared_ptr<rnwgpu::RNWebGPUManager> manager = [WebGPUModule getManager];
+  void *nativeSurface = (__bridge void *)self.layer;
+  auto &registry = rnwgpu::SurfaceRegistry::getInstance();
+  auto gpu = manager->_gpu;
+  auto surface = manager->_platformContext->makeSurface(
+      gpu, nativeSurface, size.width, size.height);
+  registry.getSurfaceInfoOrCreate([_contextId intValue], gpu, size.width, size.height)
+      ->switchToOnscreen(nativeSurface, surface);
+}
+
+- (void)update
+{
+  auto size = self.frame.size;
+  auto &registry = rnwgpu::SurfaceRegistry::getInstance();
+  registry.getSurfaceInfo([_contextId intValue])->resize(size.width, size.height);
+}
+
+- (void)dealloc
+{
+  auto &registry = rnwgpu::SurfaceRegistry::getInstance();
+  // Remove the surface info from the registry
+  registry.removeSurfaceInfo([_contextId intValue]);
+}
+
+#ifndef RCT_NEW_ARCH_ENABLED
+// Paper only method
+// TODO: this method is wrong, it appears to call configureSurface instead of
+// updateSurface sometimes
+- (void)reactSetFrame:(CGRect)frame {
+  [super reactSetFrame:frame];
+  if (!_isConfigured) {
+    [self configure];
+    _isConfigured = YES;
+  } else {
+    [self update];
+  }
+}
+#endif //RCT_NEW_ARCH_ENABLED
+
+@end
diff --git a/packages/webgpu/ios/WebGPUModule.h b/packages/webgpu/apple/WebGPUModule.h
similarity index 100%
rename from packages/webgpu/ios/WebGPUModule.h
rename to packages/webgpu/apple/WebGPUModule.h
diff --git a/packages/webgpu/ios/WebGPUModule.mm b/packages/webgpu/apple/WebGPUModule.mm
similarity index 96%
rename from packages/webgpu/ios/WebGPUModule.mm
rename to packages/webgpu/apple/WebGPUModule.mm
index 6938c0ce..fa83bcb3 100644
--- a/packages/webgpu/ios/WebGPUModule.mm
+++ b/packages/webgpu/apple/WebGPUModule.mm
@@ -1,6 +1,6 @@
 #import "WebGPUModule.h"
 #import "GPUCanvasContext.h"
-#include "IOSPlatformContext.h"
+#include "ApplePlatformContext.h"
 
 #import <React/RCTBridge+Private.h>
 #import <React/RCTLog.h>
@@ -67,7 +67,7 @@ - (void)invalidate {
     jsInvoker = cxxBridge.jsCallInvoker;
   }
   std::shared_ptr<rnwgpu::PlatformContext> platformContext =
-      std::make_shared<rnwgpu::IOSPlatformContext>();
+      std::make_shared<rnwgpu::ApplePlatformContext>();
   // TODO: remove allocation here
   webgpuManager = std::make_shared<rnwgpu::RNWebGPUManager>(runtime, jsInvoker,
                                                             platformContext);
diff --git a/packages/webgpu/ios/WebGPUView.h b/packages/webgpu/apple/WebGPUView.h
similarity index 63%
rename from packages/webgpu/ios/WebGPUView.h
rename to packages/webgpu/apple/WebGPUView.h
index 301715a3..ba373644 100644
--- a/packages/webgpu/ios/WebGPUView.h
+++ b/packages/webgpu/apple/WebGPUView.h
@@ -8,9 +8,6 @@
 NS_ASSUME_NONNULL_BEGIN
 
 @interface WebGPUView : RCTViewComponentView
-+ (void)registerMetalView:(MetalView *)metalView
-            withContextId:(NSNumber *)contextId;
-+ (bool)isContextRegisterd:(NSNumber *)contextId;
 @end
 
 NS_ASSUME_NONNULL_END
diff --git a/packages/webgpu/apple/WebGPUView.mm b/packages/webgpu/apple/WebGPUView.mm
new file mode 100644
index 00000000..160cc799
--- /dev/null
+++ b/packages/webgpu/apple/WebGPUView.mm
@@ -0,0 +1,69 @@
+#ifdef RCT_NEW_ARCH_ENABLED
+#import "WebGPUView.h"
+
+#import <react/renderer/components/RNWgpuViewSpec/EventEmitters.h>
+#import <react/renderer/components/RNWgpuViewSpec/Props.h>
+#import <react/renderer/components/RNWgpuViewSpec/RCTComponentViewHelpers.h>
+#import <react/renderer/components/RNWgpuViewSpec/ComponentDescriptors.h>
+
+#import "MetalView.h"
+#import "RCTFabricComponentsPlugins.h"
+#import "Utils.h"
+
+using namespace facebook::react;
+
+@implementation WebGPUView
+
++ (ComponentDescriptorProvider)componentDescriptorProvider {
+  return concreteComponentDescriptorProvider<WebGPUViewComponentDescriptor>();
+}
+
+- (void)prepareForRecycle {
+  [super prepareForRecycle];
+  /*
+    It's important to destroy the Metal Layer before releasing a view
+    to the recycled pool to prevent displaying outdated content from
+    the last usage in the new context.
+  */
+  self.contentView = nil;
+}
+
+- (MetalView *)getContentView
+{
+  if (!self.contentView) {
+    self.contentView = [MetalView new];
+  }
+  return (MetalView *)self.contentView;
+}
+
+- (void)updateProps:(const Props::Shared &)props
+           oldProps:(const Props::Shared &)oldProps {
+  const auto &oldViewProps =
+      *std::static_pointer_cast<const WebGPUViewProps>(_props);
+  const auto &newViewProps =
+      *std::static_pointer_cast<const WebGPUViewProps>(props);
+
+  if (newViewProps.contextId != oldViewProps.contextId) {
+    /*
+      The context is set only once during mounting the component
+      and never changes because it isn't available for users to modify.
+    */
+    MetalView *metalView = [MetalView new];
+    self.contentView = metalView;
+    [metalView setContextId:@(newViewProps.contextId)];
+    [metalView configure];
+  }
+
+  [super updateProps:props oldProps:oldProps];
+}
+
+- (void)updateLayoutMetrics:(const LayoutMetrics &)layoutMetrics
+           oldLayoutMetrics:(const LayoutMetrics &)oldLayoutMetrics {
+  [super updateLayoutMetrics:layoutMetrics oldLayoutMetrics:oldLayoutMetrics];
+  [(MetalView *)self.contentView update];
+}
+
+Class<RCTComponentViewProtocol> WebGPUViewCls(void) { return WebGPUView.class; }
+
+@end
+#endif
diff --git a/packages/webgpu/ios/WebGPUViewManager.mm b/packages/webgpu/apple/WebGPUViewManager.mm
similarity index 100%
rename from packages/webgpu/ios/WebGPUViewManager.mm
rename to packages/webgpu/apple/WebGPUViewManager.mm
index dc6d1505..7a37bcf0 100644
--- a/packages/webgpu/ios/WebGPUViewManager.mm
+++ b/packages/webgpu/apple/WebGPUViewManager.mm
@@ -1,8 +1,8 @@
+#import <React/RCTUIManager.h>
+#import <React/RCTViewManager.h>
 #import "MetalView.h"
 #import "RCTBridge.h"
 #import "WebGPUModule.h"
-#import <React/RCTUIManager.h>
-#import <React/RCTViewManager.h>
 
 @interface WebGPUViewManager : RCTViewManager
 @end
diff --git a/packages/webgpu/ios/MetalView.mm b/packages/webgpu/ios/MetalView.mm
deleted file mode 100644
index cf6e3fba..00000000
--- a/packages/webgpu/ios/MetalView.mm
+++ /dev/null
@@ -1,40 +0,0 @@
-#import "MetalView.h"
-#import "SurfaceUtils.h"
-#import "webgpu_cpp.h"
-#import <React/RCTViewManager.h>
-
-@implementation MetalView {
-  BOOL _isConfigured;
-}
-
-+ (Class)layerClass {
-  return [CAMetalLayer class];
-}
-
-// Paper only method
-// TODO: this method is wrong, it appears to call configureSurface instead of
-// updateSurface sometimes
-- (void)reactSetFrame:(CGRect)frame {
-  [super reactSetFrame:frame];
-  if (!_isConfigured) {
-    [SurfaceUtils configureSurface:self.layer
-                              size:self.frame.size
-                         contextId:[_contextId intValue]];
-    _isConfigured = YES;
-  } else {
-    [SurfaceUtils updateSurface:[_contextId intValue] size:self.frame.size];
-  }
-}
-
-- (void)willMoveToSuperview:(UIView *)newSuperview {
-  [super willMoveToSuperview:newSuperview];
-
-  if (newSuperview == nil) {
-    // The view is being removed from its superview
-    // Add your cleanup code here
-    [SurfaceUtils cleanupSurface:[_contextId intValue]];
-    _isConfigured = NO;
-  }
-}
-
-@end
diff --git a/packages/webgpu/ios/SurfaceUtils.h b/packages/webgpu/ios/SurfaceUtils.h
deleted file mode 100644
index a0821e6c..00000000
--- a/packages/webgpu/ios/SurfaceUtils.h
+++ /dev/null
@@ -1,15 +0,0 @@
-#pragma once
-
-#import <UIKit/UIKit.h>
-
-@interface SurfaceUtils : NSObject
-
-+ (void)configureSurface:(CALayer *)layer
-                    size:(CGSize)size
-               contextId:(int)contextId;
-
-+ (void)updateSurface:(int)contextId size:(CGSize)size;
-
-+ (void)cleanupSurface:(int)contextId;
-
-@end
diff --git a/packages/webgpu/ios/SurfaceUtils.mm b/packages/webgpu/ios/SurfaceUtils.mm
deleted file mode 100644
index 6753a224..00000000
--- a/packages/webgpu/ios/SurfaceUtils.mm
+++ /dev/null
@@ -1,34 +0,0 @@
-#import "SurfaceUtils.h"
-#import "MetalView.h"
-#import "WebGPUModule.h"
-#import "WebGPUView.h"
-
-@implementation SurfaceUtils
-
-+ (void)configureSurface:(CALayer *)layer
-                    size:(CGSize)size
-               contextId:(int)contextId {
-  std::shared_ptr<rnwgpu::RNWebGPUManager> manager = [WebGPUModule getManager];
-  void *nativeSurface = (__bridge void *)layer;
-  auto &registry = rnwgpu::SurfaceRegistry::getInstance();
-  auto gpu = manager->_gpu;
-  auto surface = manager->_platformContext->makeSurface(
-      gpu, nativeSurface, size.width, size.height);
-  registry.getSurfaceInfoOrCreate(contextId, gpu, size.width, size.height)
-      ->switchToOnscreen(nativeSurface, surface);
-}
-
-+ (void)updateSurface:(int)contextId size:(CGSize)size {
-  // std::shared_ptr<rnwgpu::RNWebGPUManager> manager = [WebGPUModule
-  // getManager];
-  auto &registry = rnwgpu::SurfaceRegistry::getInstance();
-  registry.getSurfaceInfo(contextId)->resize(size.width, size.height);
-}
-
-+ (void)cleanupSurface:(int)contextId {
-  auto &registry = rnwgpu::SurfaceRegistry::getInstance();
-  // Remove the surface info from the registry
-  registry.removeSurfaceInfo(contextId);
-}
-
-@end
diff --git a/packages/webgpu/ios/WebGPUView.mm b/packages/webgpu/ios/WebGPUView.mm
deleted file mode 100644
index d8f3fe40..00000000
--- a/packages/webgpu/ios/WebGPUView.mm
+++ /dev/null
@@ -1,86 +0,0 @@
-#ifdef RCT_NEW_ARCH_ENABLED
-#import "WebGPUView.h"
-
-#import <react/renderer/components/RNWgpuViewSpec/EventEmitters.h>
-#import <react/renderer/components/RNWgpuViewSpec/Props.h>
-#import <react/renderer/components/RNWgpuViewSpec/RCTComponentViewHelpers.h>
-
-#import "MetalView.h"
-#import "RCTFabricComponentsPlugins.h"
-#import "Utils.h"
-#import "WebGPUModule.h"
-#import "WebGPUViewComponentDescriptor.h"
-
-using namespace facebook::react;
-
-@interface WebGPUView () <RCTWebGPUViewViewProtocol>
-
-@end
-
-@implementation WebGPUView {
-  NSNumber *_contextId;
-}
-
-static NSMutableDictionary<NSNumber *, MetalView *> *metalViewRegistry =
-    [NSMutableDictionary new];
-
-+ (ComponentDescriptorProvider)componentDescriptorProvider {
-  return concreteComponentDescriptorProvider<WebGPUViewComponentDescriptor>();
-}
-
-+ (void)registerMetalView:(MetalView *)metalView
-            withContextId:(NSNumber *)contextId {
-  metalViewRegistry[contextId] = metalView;
-}
-
-+ (bool)isContextRegisterd:(NSNumber *)contextId {
-  return metalViewRegistry[contextId] != nil;
-}
-
-- (instancetype)initWithFrame:(CGRect)frame {
-  if (self = [super initWithFrame:frame]) {
-    static const auto defaultProps = std::make_shared<const WebGPUViewProps>();
-    _props = defaultProps;
-  }
-
-  return self;
-}
-
-- (void)prepareForRecycle {
-  [super prepareForRecycle];
-  self.contentView = nil;
-  if ([metalViewRegistry objectForKey:_contextId] != nil) {
-    [metalViewRegistry removeObjectForKey:_contextId];
-  }
-}
-
-- (void)updateProps:(const facebook::react::Props::Shared &)props
-           oldProps:(const facebook::react::Props::Shared &)oldProps {
-  const auto &oldViewProps =
-      *std::static_pointer_cast<const WebGPUViewProps>(_props);
-  const auto &newViewProps =
-      *std::static_pointer_cast<const WebGPUViewProps>(props);
-
-  if (newViewProps.contextId != oldViewProps.contextId) {
-    _contextId = [[NSNumber alloc] initWithInt:newViewProps.contextId];
-  }
-
-  [super updateProps:props oldProps:oldProps];
-}
-
-- (void)updateLayoutMetrics:
-            (const facebook::react::LayoutMetrics &)layoutMetrics
-           oldLayoutMetrics:
-               (const facebook::react::LayoutMetrics &)oldLayoutMetrics {
-  [super updateLayoutMetrics:layoutMetrics oldLayoutMetrics:oldLayoutMetrics];
-  if (!self.contentView) {
-    const auto &props =
-        *std::static_pointer_cast<WebGPUViewProps const>(_props);
-    self.contentView = metalViewRegistry[@(props.contextId)];
-  }
-}
-
-Class<RCTComponentViewProtocol> WebGPUViewCls(void) { return WebGPUView.class; }
-
-@end
-#endif
diff --git a/packages/webgpu/ios/WebGPUViewComponentDescriptor.h b/packages/webgpu/ios/WebGPUViewComponentDescriptor.h
deleted file mode 100644
index c9a16b54..00000000
--- a/packages/webgpu/ios/WebGPUViewComponentDescriptor.h
+++ /dev/null
@@ -1,61 +0,0 @@
-#ifdef RCT_NEW_ARCH_ENABLED
-
-#pragma once
-
-#include <react/debug/react_native_assert.h>
-#include <react/renderer/components/RNWgpuViewSpec/ShadowNodes.h>
-#include <react/renderer/components/view/ConcreteViewShadowNode.h>
-#include <react/renderer/core/ConcreteComponentDescriptor.h>
-#include <react/renderer/core/LayoutContext.h>
-
-#import "MetalView.h"
-#import "SurfaceUtils.h"
-#import "WebGPUView.h"
-
-namespace facebook {
-namespace react {
-
-class WebGPUViewCustomShadowNode final : public WebGPUViewShadowNode {
-
-public:
-  using ConcreteViewShadowNode::ConcreteViewShadowNode;
-
-  void layout(LayoutContext layoutContext) override {
-    YogaLayoutableShadowNode::layout(layoutContext);
-    configureSurface();
-  }
-
-  void configureSurface() {
-    const auto &viewProps =
-        *std::static_pointer_cast<WebGPUViewProps const>(props_);
-    if ([WebGPUView isContextRegisterd:@(viewProps.contextId)]) {
-      return;
-    }
-    __block MetalView *metalView;
-    __block CALayer *layer;
-    dispatch_sync(dispatch_get_main_queue(), ^{
-      metalView = [[MetalView alloc] init];
-      layer = metalView.layer;
-    });
-    [WebGPUView registerMetalView:metalView
-                    withContextId:@(viewProps.contextId)];
-
-    // TODO: use physical size
-    float width = layoutMetrics_.frame.size.width;
-    float height = layoutMetrics_.frame.size.height;
-    [SurfaceUtils configureSurface:layer
-                              size:CGSizeMake(width, height)
-                         contextId:viewProps.contextId];
-  }
-};
-
-class WebGPUViewComponentDescriptor final
-    : public ConcreteComponentDescriptor<WebGPUViewCustomShadowNode> {
-public:
-  using ConcreteComponentDescriptor::ConcreteComponentDescriptor;
-};
-
-} // namespace react
-} // namespace facebook
-
-#endif // RCT_NEW_ARCH_ENABLED
diff --git a/packages/webgpu/react-native-wgpu.podspec b/packages/webgpu/react-native-wgpu.podspec
index c2354237..c318f5b6 100644
--- a/packages/webgpu/react-native-wgpu.podspec
+++ b/packages/webgpu/react-native-wgpu.podspec
@@ -15,7 +15,7 @@ Pod::Spec.new do |s|
   s.source       = { :git => "https://github.com/wcandillon/react-native-webgpu.git", :tag => "#{s.version}" }
 
   s.source_files = [
-    "ios/**/*.{h,c,cc,cpp,m,mm,swift}",
+    "apple/**/*.{h,c,cc,cpp,m,mm,swift}",  
     "cpp/**/*.{h,cpp}"
   ]
 
diff --git a/packages/webgpu/scripts/build/copy-artifacts.ts b/packages/webgpu/scripts/build/copy-artifacts.ts
index 0812a688..249931dc 100644
--- a/packages/webgpu/scripts/build/copy-artifacts.ts
+++ b/packages/webgpu/scripts/build/copy-artifacts.ts
@@ -1,6 +1,5 @@
 import { $, checkBuildArtifacts } from "./util";
 
 $("cp -R ../../artifacts/libs .");
-$("cp -R ../../artifacts/cpp/dawn cpp");
 $("cp -R ../../artifacts/cpp/webgpu cpp");
 checkBuildArtifacts();
diff --git a/packages/webgpu/scripts/build/dawn.ts b/packages/webgpu/scripts/build/dawn.ts
index d1043f0f..2ecc14c6 100644
--- a/packages/webgpu/scripts/build/dawn.ts
+++ b/packages/webgpu/scripts/build/dawn.ts
@@ -99,6 +99,7 @@ const apple = {
   $("git reset --hard HEAD");
   $(`git apply ${__dirname}/static_build.patch`);
   process.chdir("../..");
+  console.log("Copy headers");
 
   // Build Android
   for (const platform of android.platforms) {
@@ -164,14 +165,20 @@ const apple = {
   });
 
   console.log("Copy headers");
+  $(`rm -rf ${projectRoot}/cpp/webgpu`);
+  $(`rm -rf ${projectRoot}/cpp/dawn`);
+  $(
+    `cp -R externals/dawn/out/android_arm64-v8a/gen/include/webgpu ${projectRoot}/cpp`,
+  );
+  $(
+    `cp externals/dawn/out/android_arm64-v8a/gen/include/dawn/webgpu.h ${projectRoot}/cpp/webgpu/webgpu.h`,
+  );
   $(
-    `cp -R externals/dawn/out/android_arm64-v8a/gen/include/* ${projectRoot}/cpp`,
+    `cp externals/dawn/out/android_arm64-v8a/gen/include/dawn/webgpu_cpp.h ${projectRoot}/cpp/webgpu/webgpu_cpp.h`,
   );
-  $(`cp externals/dawn/include/webgpu/webgpu_cpp.h ${projectRoot}/cpp/webgpu/`);
   $(
     `cp externals/dawn/include/webgpu/webgpu_enum_class_bitmasks.h ${projectRoot}/cpp/webgpu/`,
   );
-  $(`cp externals/dawn/include/webgpu/webgpu.h ${projectRoot}/cpp/webgpu/`);
   $(`cp externals/dawn/src/dawn/dawn.json ${projectRoot}/libs`);
   chdir(projectRoot);
   checkBuildArtifacts();
diff --git a/packages/webgpu/scripts/build/util.ts b/packages/webgpu/scripts/build/util.ts
index a52a63d9..776f81be 100644
--- a/packages/webgpu/scripts/build/util.ts
+++ b/packages/webgpu/scripts/build/util.ts
@@ -125,6 +125,5 @@ export const checkBuildArtifacts = () => {
   libs.forEach((lib) => {
     checkFileExists(`libs/apple/${lib}.xcframework`);
   });
-  checkFileExists("cpp/dawn/webgpu_cpp.h");
   checkFileExists("libs/dawn.json");
 };
diff --git a/yarn.lock b/yarn.lock
index bbf9a92d..e2318b57 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3144,22 +3144,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@react-navigation/native-stack@npm:^6.10.0":
-  version: 6.11.0
-  resolution: "@react-navigation/native-stack@npm:6.11.0"
-  dependencies:
-    "@react-navigation/elements": ^1.3.31
-    warn-once: ^0.1.0
-  peerDependencies:
-    "@react-navigation/native": ^6.0.0
-    react: "*"
-    react-native: "*"
-    react-native-safe-area-context: ">= 3.0.0"
-    react-native-screens: ">= 3.0.0"
-  checksum: d3dd57c216f5dbe53636bdb9aa48fe27831640f868cf5c68731943a49b68cb457d81182e7868f3e3033da0564e9f193f1b06b69085b8bc5b04ccfbe12ea2bbc0
-  languageName: node
-  linkType: hard
-
 "@react-navigation/native@npm:^6.1.17":
   version: 6.1.18
   resolution: "@react-navigation/native@npm:6.1.18"
@@ -3184,6 +3168,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@react-navigation/stack@npm:^6.4.0":
+  version: 6.4.1
+  resolution: "@react-navigation/stack@npm:6.4.1"
+  dependencies:
+    "@react-navigation/elements": ^1.3.31
+    color: ^4.2.3
+    warn-once: ^0.1.0
+  peerDependencies:
+    "@react-navigation/native": ^6.0.0
+    react: "*"
+    react-native: "*"
+    react-native-gesture-handler: ">= 1.0.0"
+    react-native-safe-area-context: ">= 3.0.0"
+    react-native-screens: ">= 3.0.0"
+  checksum: 09bcfb001db0f411df881da9f2551b7015c4d5259a77fcb93196de308838035d016dc4dcb654d16d9cd4cc99f09f5e48add796aa903f9a253678947c35b18199
+  languageName: node
+  linkType: hard
+
 "@react-three/fiber@npm:8.17.6":
   version: 8.17.6
   resolution: "@react-three/fiber@npm:8.17.6"
@@ -4274,7 +4276,7 @@ __metadata:
     "@react-native/metro-config": 0.74.84
     "@react-native/typescript-config": 0.74.84
     "@react-navigation/native": ^6.1.17
-    "@react-navigation/native-stack": ^6.10.0
+    "@react-navigation/stack": ^6.4.0
     "@react-three/fiber": ^8.17.6
     "@rnx-kit/metro-config": ^1.3.17
     "@types/node": ^20.14.7
@@ -4294,7 +4296,6 @@ __metadata:
     react-native-macos: ^0.74.0
     react-native-reanimated: ^3.12.1
     react-native-safe-area-context: ^4.10.7
-    react-native-screens: ^3.32.0
     react-native-test-app: ^3.10.8
     react-native-wgpu: "*"
     react-test-renderer: 18.2.0
@@ -5313,13 +5314,33 @@ __metadata:
   languageName: node
   linkType: hard
 
-"color-name@npm:~1.1.4":
+"color-name@npm:^1.0.0, color-name@npm:~1.1.4":
   version: 1.1.4
   resolution: "color-name@npm:1.1.4"
   checksum: b0445859521eb4021cd0fb0cc1a75cecf67fceecae89b63f62b201cca8d345baf8b952c966862a9d9a2632987d4f6581f0ec8d957dfacece86f0a7919316f610
   languageName: node
   linkType: hard
 
+"color-string@npm:^1.9.0":
+  version: 1.9.1
+  resolution: "color-string@npm:1.9.1"
+  dependencies:
+    color-name: ^1.0.0
+    simple-swizzle: ^0.2.2
+  checksum: c13fe7cff7885f603f49105827d621ce87f4571d78ba28ef4a3f1a104304748f620615e6bf065ecd2145d0d9dad83a3553f52bb25ede7239d18e9f81622f1cc5
+  languageName: node
+  linkType: hard
+
+"color@npm:^4.2.3":
+  version: 4.2.3
+  resolution: "color@npm:4.2.3"
+  dependencies:
+    color-convert: ^2.0.1
+    color-string: ^1.9.0
+  checksum: 0579629c02c631b426780038da929cca8e8d80a40158b09811a0112a107c62e10e4aad719843b791b1e658ab4e800558f2e87ca4522c8b32349d497ecb6adeb4
+  languageName: node
+  linkType: hard
+
 "colorette@npm:^1.0.7":
   version: 1.4.0
   resolution: "colorette@npm:1.4.0"
@@ -7527,6 +7548,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"is-arrayish@npm:^0.3.1":
+  version: 0.3.2
+  resolution: "is-arrayish@npm:0.3.2"
+  checksum: 977e64f54d91c8f169b59afcd80ff19227e9f5c791fa28fa2e5bce355cbaf6c2c356711b734656e80c9dd4a854dd7efcf7894402f1031dfc5de5d620775b4d5f
+  languageName: node
+  linkType: hard
+
 "is-async-function@npm:^2.0.0":
   version: 2.0.0
   resolution: "is-async-function@npm:2.0.0"
@@ -10380,15 +10408,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-freeze@npm:^1.0.0":
-  version: 1.0.4
-  resolution: "react-freeze@npm:1.0.4"
-  peerDependencies:
-    react: ">=17.0.0"
-  checksum: 6b4d93209dff04a1f25d9f8e0c56a9a8a80e7889e8e8267299f34449c7e41a9ab90cad24569d03dd7173b56b7496576dba68f71f1d4e5c8be72f0633023668bc
-  languageName: node
-  linkType: hard
-
 "react-is@npm:^16.12.0 || ^17.0.0 || ^18.0.0, react-is@npm:^18.0.0, react-is@npm:^18.2.0":
   version: 18.3.1
   resolution: "react-is@npm:18.3.1"
@@ -10540,19 +10559,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-native-screens@npm:^3.32.0":
-  version: 3.34.0
-  resolution: "react-native-screens@npm:3.34.0"
-  dependencies:
-    react-freeze: ^1.0.0
-    warn-once: ^0.1.0
-  peerDependencies:
-    react: "*"
-    react-native: "*"
-  checksum: 28c1f6e556c318ffcbd79d153b9612cc8a0b8d8b70f909d3cde2fd6d0586a7c151a449e57400d8996f4ee6c3b5140c5c4f643a427e974f6dc573b2bcd8eb7356
-  languageName: node
-  linkType: hard
-
 "react-native-test-app@npm:^3.10.8":
   version: 3.10.8
   resolution: "react-native-test-app@npm:3.10.8"
@@ -11357,6 +11363,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"simple-swizzle@npm:^0.2.2":
+  version: 0.2.2
+  resolution: "simple-swizzle@npm:0.2.2"
+  dependencies:
+    is-arrayish: ^0.3.1
+  checksum: a7f3f2ab5c76c4472d5c578df892e857323e452d9f392e1b5cf74b74db66e6294a1e1b8b390b519fa1b96b5b613f2a37db6cffef52c3f1f8f3c5ea64eb2d54c0
+  languageName: node
+  linkType: hard
+
 "sisteransi@npm:^1.0.5":
   version: 1.0.5
   resolution: "sisteransi@npm:1.0.5"