diff --git a/packages/ui-default/package.json b/packages/ui-default/package.json
index da37173b..e8d6296f 100644
--- a/packages/ui-default/package.json
+++ b/packages/ui-default/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@hydrooj/ui-default",
-  "version": "4.10.2",
+  "version": "4.10.3",
   "author": "undefined <i@undefined.moe>",
   "license": "AGPL-3.0",
   "main": "hydro.js",
@@ -66,6 +66,7 @@
     "moment": "^2.29.1",
     "monaco-editor": "^0.24.0",
     "monaco-editor-webpack-plugin": "^3.0.1",
+    "nanoid": "^3.1.23",
     "normalize.css": "^8.0.1",
     "nprogress": "^0.2.0",
     "optimize-css-assets-webpack-plugin": "^5.0.4",
@@ -96,7 +97,6 @@
     "through2": "^4.0.2",
     "timeago-react": "^3.0.2",
     "timeago.js": "^4.0.2",
-    "uuid": "^8.3.2",
     "vditor": "^3.8.4",
     "vinyl-buffer": "^1.0.1",
     "wastyle": "^0.0.5",
diff --git a/packages/ui-default/utils/pjax.js b/packages/ui-default/utils/pjax.js
index 039681ea..17e5d3a4 100644
--- a/packages/ui-default/utils/pjax.js
+++ b/packages/ui-default/utils/pjax.js
@@ -1,7 +1,7 @@
 // Modified from jquery-pjax to support multiple fragments and jQuery 3.0
 // https://github.com/defunkt/jquery-pjax/blob/master/jquery.pjax.js
 
-import { v4 as uuid } from 'uuid';
+import { nanoid } from 'nanoid';
 import Notification from 'vj/components/notification';
 import NProgress from 'vj/components/nprogress';
 import request from './request';
@@ -56,7 +56,7 @@ pjax.request = async (opt) => {
   if (!currentState) {
     // create initial state
     currentState = {
-      id: uuid(),
+      id: nanoid(),
       options: {
         url: window.location.href,
       },
@@ -81,7 +81,7 @@ pjax.request = async (opt) => {
     const data = await request.ajax(params);
     const meta = extractMetaData(options, data);
     currentState = {
-      id: uuid(),
+      id: nanoid(),
       options: opt,
     };
     if (options.push) {