前端界面添加防抖

This commit is contained in:
zixu 2024-08-29 09:38:47 +08:00
parent 8cff027a44
commit c6567b8948
4 changed files with 25 additions and 7 deletions

View File

@ -98,7 +98,7 @@ const corsMiddleware: cMiddleware = async (req, res, next) => {
}; };
const fontApiMiddleware: cMiddleware = async (req, res, next) => { const fontApiMiddleware: cMiddleware = async (req, res, next) => {
// 创建一个新的 URL 对象(需要一个完整的 URL必须包含协议和主机 // 创建一个新的 URL 对象(需要一个完整的 URL必须包含协议和主机
const url = new URL(req.url, "http://test.com"); const url = new URL(req.url, "https://webfont.shenzilong.com");
if (!url.pathname.startsWith("/api")) return next(req, res); if (!url.pathname.startsWith("/api")) return next(req, res);
const params = new URLSearchParams(url.search); const params = new URLSearchParams(url.search);
const font = params.get("font") || ""; const font = params.get("font") || "";

View File

@ -1,7 +1,7 @@
{ {
"name": "webfont", "name": "webfont",
"private": true, "private": true,
"version": "1.0.2", "version": "1.0.3",
"type": "module", "type": "module",
"scripts": { "scripts": {
"dev": "vite", "dev": "vite",
@ -9,7 +9,8 @@
"build_backend": "tsup && ./llrt compile ./dist_backend/app.cjs ./dist_backend/app.lrt", "build_backend": "tsup && ./llrt compile ./dist_backend/app.cjs ./dist_backend/app.lrt",
"docker_build": "docker build -t llej0/web-font:${npm_package_version} -t llej0/web-font:latest .", "docker_build": "docker build -t llej0/web-font:${npm_package_version} -t llej0/web-font:latest .",
"docker_push": "docker push llej0/web-font:${npm_package_version} && docker push llej0/web-font:latest", "docker_push": "docker push llej0/web-font:${npm_package_version} && docker push llej0/web-font:latest",
"preview": "vite preview" "preview": "vite preview",
"release":"pnpm build && pnpm build_backend && pnpm docker_build && pnpm docker_push"
}, },
"dependencies": { "dependencies": {
"fonteditor-core": "^2.4.1", "fonteditor-core": "^2.4.1",

View File

@ -1,4 +1,4 @@
import { createMemo, createSignal } from "solid-js"; import { createMemo, createSignal, type Accessor } from "solid-js";
function App() { function App() {
const [text, set_text] = createSignal("天地无极,乾坤借法"); const [text, set_text] = createSignal("天地无极,乾坤借法");
@ -19,6 +19,7 @@ function App() {
} }
`, `,
); );
const throttledSetMemo = useThrottledMemo(() => style(), 1000);
return ( return (
<div> <div>
<h1> <h1>
@ -34,9 +35,27 @@ function App() {
</div> </div>
<pre>{"<style>" + style() + "</style>"}</pre> <pre>{"<style>" + style() + "</style>"}</pre>
<style>{style()}</style> <style>{throttledSetMemo()}</style>
</div> </div>
); );
} }
export default App; export default App;
function useThrottledMemo<T>(fn: () => T, delay: number): Accessor<T> {
const [throttledValue, setThrottledValue] = createSignal<T>(fn());
let timeoutId: ReturnType<typeof setTimeout> | null = null;
createMemo(() => {
const value = fn();
if (timeoutId === null) {
setThrottledValue(value);
timeoutId = setTimeout(() => {
timeoutId = null;
setThrottledValue(fn());
}, delay);
}
});
return throttledValue;
}

View File

@ -1,13 +1,11 @@
import { defineConfig } from "vite"; import { defineConfig } from "vite";
import solid from "vite-plugin-solid"; import solid from "vite-plugin-solid";
import {} from "fs";
export default defineConfig({ export default defineConfig({
plugins: [solid()], plugins: [solid()],
server: { server: {
host: "0.0.0.0", host: "0.0.0.0",
proxy: { proxy: {
// with options
"/api": { "/api": {
target: "http://localhost:8087", target: "http://localhost:8087",
changeOrigin: true, changeOrigin: true,