0.0.22

- Changed caching handler from 'NetworkFirst' to 'CacheFirst' for improved performance.
- Extended cache expiration time from 5 minutes to 1 hour to enhance data availability.

package.json

@@ -1,7 +1,7 @@
 {
   "name": "litek",
   "private": true,
-  "version": "0.0.19",
+  "version": "0.0.22",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -44,11 +44,14 @@
     "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-react-refresh": "^0.4.22",
     "globals": "^16.4.0",
+    "terser": "^5.44.0",
     "tsx": "^4.19.2",
     "tw-animate-css": "^1.4.0",
     "typescript": "~5.9.3",
     "typescript-eslint": "^8.45.0",
-    "vite": "npm:rolldown-vite@7.1.14"
+    "vite": "npm:rolldown-vite@7.1.14",
+    "vite-plugin-pwa": "^1.1.0",
+    "workbox-window": "^7.3.0"
   },
   "pnpm": {
     "overrides": {

src/main.tsx

@@ -13,3 +13,21 @@ createRoot(document.getElementById('root')!).render(
     <Toaster />
   </StrictMode>
 )
+
+// 注册 Service Worker
+if ('serviceWorker' in navigator && import.meta.env.PROD) {
+  import('workbox-window').then(({ Workbox }) => {
+    const wb = new Workbox('/sw.js')
+    
+    wb.addEventListener('installed', (event) => {
+      if (event.isUpdate) {
+        console.log('New service worker installed, reloading page...')
+        window.location.reload()
+      }
+    })
+
+    wb.register()
+  }).catch((error) => {
+    console.error('Failed to register service worker:', error)
+  })
+}

src/vite-env.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="vite/client" />
+/// <reference types="vite-plugin-pwa/client" />
+

vite.config.ts

@@ -2,10 +2,55 @@ import path from "path"
 import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react'
 import tailwindcss from "@tailwindcss/vite"
+import { VitePWA } from 'vite-plugin-pwa'
 
 // https://vite.dev/config/
 export default defineConfig({
-  plugins: [react(), tailwindcss()],
+  plugins: [
+    react(), 
+    tailwindcss(),
+    VitePWA({
+      registerType: 'autoUpdate',
+      includeAssets: ['lite.svg', 'robots.txt', 'sitemap.xml'],
+      manifest: {
+        name: 'Lite Kit - Lightweight Online Tools',
+        short_name: 'Lite Kit',
+        description: 'Free online tools including UUID generator, JSON formatter, Base64 encoder/decoder, network testing tools and more',
+        theme_color: '#000000',
+        background_color: '#000000',
+        display: 'standalone',
+        icons: [
+          {
+            src: '/lite.svg',
+            type: 'image/svg+xml',
+            sizes: 'any'
+          }
+        ]
+      },
+      workbox: {
+        globPatterns: ['**/*.{js,css,html,svg,png,ico,woff2}'],
+        runtimeCaching: [
+          {
+            urlPattern: /^https:\/\/ipinfo\.io\/.*/i,
+            handler: 'CacheFirst', // 改为 CacheFirst，优先使用缓存
+            options: {
+              cacheName: 'ipinfo-cache',
+              expiration: {
+                maxEntries: 10,
+                maxAgeSeconds: 60 * 60 // 延长到 1 小时
+              },
+              cacheableResponse: {
+                statuses: [0, 200]
+              }
+            }
+          }
+        ],
+        cleanupOutdatedCaches: true,
+        clientsClaim: true,
+        skipWaiting: true
+      }
+    })
+  ],
   resolve: {
     alias: {
       "@": path.resolve(__dirname, "./src"),
@@ -15,11 +60,15 @@ export default defineConfig({
     rollupOptions: {
       output: {
         manualChunks: (id) => {
-          // React核心库
+          // React 核心拆分得更细
-          if (id.includes('node_modules/react') || 
+          if (id.includes('node_modules/react/') && !id.includes('node_modules/react-dom')) {
-              id.includes('node_modules/react-dom') || 
+            return 'react-core';
-              id.includes('node_modules/react-router-dom')) {
+          }
-            return 'react-vendor';
+          if (id.includes('node_modules/react-dom/')) {
+            return 'react-dom';
+          }
+          if (id.includes('node_modules/react-router-dom')) {
+            return 'react-router';
           }
           // Radix UI组件
           if (id.includes('node_modules/@radix-ui')) {
@@ -29,9 +78,26 @@ export default defineConfig({
           if (id.includes('node_modules/lucide-react')) {
             return 'icons';
           }
+          // 其他工具库
+          if (id.includes('node_modules/')) {
+            return 'vendor';
+          }
         },
       },
     },
+    // 启用更激进的压缩
+    minify: 'terser',
+    terserOptions: {
+      compress: {
+        drop_console: true,
+        drop_debugger: true,
+        pure_funcs: ['console.log'],
+        // 移除未使用的代码
+        unused: true,
+        // 移除死代码
+        dead_code: true,
+      },
+    },
     chunkSizeWarningLimit: 500,
   },
 })