diff --git a/examples/react/src/App.tsx b/examples/react/src/App.tsx
index ce4ca37..0f3c96f 100644
--- a/examples/react/src/App.tsx
+++ b/examples/react/src/App.tsx
@@ -1,11 +1,13 @@
 import './App.css'
 import {Code, Grid} from "@mantine/core";
 import {CardImage} from "./CardImage.tsx";
+import {VideoAssets} from "./video-assets.tsx";
 
 function App() {
     return (
         <>
             <Grid>
+                <VideoAssets/>
                 <CardImage col={{span:12}} titleCard={"Background image css"} images={[]}>
                     <div style={{height:100,width:100,position:'relative'}}>
 
diff --git a/examples/react/src/video-assets.tsx b/examples/react/src/video-assets.tsx
new file mode 100644
index 0000000..3f6182a
--- /dev/null
+++ b/examples/react/src/video-assets.tsx
@@ -0,0 +1,20 @@
+import {useRef} from "react";
+
+export const VideoAssets = () => {
+    const videoRef = useRef(null);
+    return <>
+        <video src="/base/flower.mp4" controls ref={videoRef}/>
+        <div className="card">
+            <button
+                onClick={() => {
+                    const video = videoRef.current;
+                    if (video && video.duration > 0) {
+                        video.currentTime = video.duration / 2;
+                    }
+                }}
+            >
+                video.currentTime = video.duration / 2
+            </button>
+        </div>
+    </>
+}
diff --git a/examples/react/videos/flower.mp4 b/examples/react/videos/flower.mp4
new file mode 100644
index 0000000..bd91051
Binary files /dev/null and b/examples/react/videos/flower.mp4 differ
diff --git a/examples/react/vite.config.ts b/examples/react/vite.config.ts
index da9bdde..5756351 100644
--- a/examples/react/vite.config.ts
+++ b/examples/react/vite.config.ts
@@ -9,7 +9,7 @@ export default defineConfig({
     },
     build: {
         rollupOptions: {
-            external:['.png'],
+            external: ['.png'],
             output: {
                 chunkFileNames: 'assets/js/[name]-[hash].js',
                 entryFileNames: 'assets/js/[name]-[hash].js',
@@ -42,6 +42,7 @@ export default defineConfig({
                 input: "public/**",
                 output: "/images/assets-a"
             },
+            "videos/**",
             {
                 input: "../../shared-assets/**",
                 output: "shared/images",
diff --git a/packages/libs/src/server.ts b/packages/libs/src/server.ts
index 7ef0aa9..7c47882 100644
--- a/packages/libs/src/server.ts
+++ b/packages/libs/src/server.ts
@@ -49,6 +49,30 @@ function getContentType(file: string) {
 	return mime.lookup(file);
 }
 
+/**
+ * Parse Range header from request
+ * Returns { start, end } or null if no valid range
+ */
+function parseRange(
+	rangeHeader: string | undefined,
+	fileSize: number
+): {start: number; end: number} | null {
+	if (!rangeHeader) return null;
+
+	const match = rangeHeader.match(/bytes=(\d*)-(\d*)/);
+	if (!match) return null;
+
+	const start = match[1] ? Number.parseInt(match[1], 10) : 0;
+	const end = match[2] ? Number.parseInt(match[2], 10) : fileSize - 1;
+
+	// Validate range
+	if (start >= fileSize || end >= fileSize || start > end) {
+		return null;
+	}
+
+	return {start, end};
+}
+
 function handleWriteToServe(
 	res: http.ServerResponse,
 	req: IncomingMessage,
@@ -57,14 +81,57 @@ function handleWriteToServe(
 	cacheOption: ICacheConfig = {}
 ) {
 	try {
+		// Get file stats for size
+		const stats = fs.statSync(path);
+		const fileSize = stats.size;
+
+		// Parse Range header
+		const rangeHeader = req.headers.range;
+		const range = parseRange(rangeHeader, fileSize);
+
+		// Set cache options
 		for (const key in cacheOption) {
 			res.setHeader(key, cacheOption[key]);
 		}
-		// res.setHeader("Cache-Control", "max-age=31536000, immutable");
+
+		// Always set Accept-Ranges header to indicate range support
+		res.setHeader("Accept-Ranges", "bytes");
 		res.setHeader("Content-Type", contentType);
-		res.write(fs.readFileSync(path));
-		res.end();
+
+		if (range) {
+			// Handle range request (for video seeking)
+			const {start, end} = range;
+			const contentLength = end - start + 1;
+
+			// Set 206 Partial Content status
+			res.statusCode = 206;
+			res.setHeader("Content-Range", `bytes ${start}-${end}/${fileSize}`);
+			res.setHeader("Content-Length", contentLength);
+
+			// Read and send only the requested range
+			const fileStream = fs.createReadStream(path, {start, end});
+			fileStream.pipe(res);
+
+			fileStream.on("error", (err) => {
+				console.error("Error streaming file:", err);
+				res.end();
+			});
+		} else {
+			// Handle normal request (no range)
+			res.statusCode = 200;
+			res.setHeader("Content-Length", fileSize);
+			// Stream the entire file
+			const fileStream = fs.createReadStream(path);
+			fileStream.pipe(res);
+
+			fileStream.on("error", (err) => {
+				console.error("Error streaming file:", err);
+				res.end();
+			});
+		}
 	} catch (e) {
+		console.error("Error in handleWriteToServe:", e);
+		res.statusCode = 500;
 		res.write("");
 		res.end();
 	}