From 4380617601791097cc5b57f78f4e84aff1d53eff Mon Sep 17 00:00:00 2001 From: fantasticit Date: Fri, 3 Jun 2022 04:27:15 +0800 Subject: [PATCH] client: add polyfill --- packages/client/next.config.js | 2 +- packages/client/package.json | 2 ++ packages/client/src/pages/_app.tsx | 12 ++++++++++-- packages/client/src/tiptap/preload.ts | 21 +++++++++++++++++++++ pnpm-lock.yaml | 26 +++++++++----------------- 5 files changed, 43 insertions(+), 20 deletions(-) diff --git a/packages/client/next.config.js b/packages/client/next.config.js index 276cdec7..7785cd63 100644 --- a/packages/client/next.config.js +++ b/packages/client/next.config.js @@ -34,7 +34,7 @@ const nextConfig = semi({ ignoreBuildErrors: true, }, compiler: { - removeConsole: process.env.NODE_ENV === 'production', + // removeConsole: process.env.NODE_ENV === 'production', }, pwa: { disable: process.env.NODE_ENV !== 'production', diff --git a/packages/client/package.json b/packages/client/package.json index 72a12d44..db72ca32 100644 --- a/packages/client/package.json +++ b/packages/client/package.json @@ -88,6 +88,8 @@ "react-pdf": "^5.7.2", "react-query": "^3.39.0", "react-split-pane": "^0.1.92", + "requestidlecallback-polyfill": "^1.0.2", + "resize-observer-polyfill": "^1.5.1", "scroll-into-view-if-needed": "^2.2.29", "timeago.js": "^4.0.2", "tippy.js": "^6.3.7", diff --git a/packages/client/src/pages/_app.tsx b/packages/client/src/pages/_app.tsx index d1aca703..04495427 100644 --- a/packages/client/src/pages/_app.tsx +++ b/packages/client/src/pages/_app.tsx @@ -29,7 +29,9 @@ class MyApp extends App<{ isMobile: boolean }> { static getInitialProps = async ({ Component, ctx }) => { const request = ctx?.req; const getPagePropsPromise = Component.getInitialProps ? Component.getInitialProps(ctx) : Promise.resolve({}); - const [pageProps] = await Promise.all([getPagePropsPromise]); + const [pageProps] = await Promise.all([getPagePropsPromise]).catch((err) => { + return [{}]; + }); return { pageProps, @@ -38,7 +40,13 @@ class MyApp extends App<{ isMobile: boolean }> { }; componentDidMount() { - preload(); + Promise.all([ + import('resize-observer-polyfill'), + // @ts-ignore + import('requestidlecallback-polyfill'), + ]).then(() => { + preload(); + }); } render() { diff --git a/packages/client/src/tiptap/preload.ts b/packages/client/src/tiptap/preload.ts index eabce178..e5fcb1cf 100644 --- a/packages/client/src/tiptap/preload.ts +++ b/packages/client/src/tiptap/preload.ts @@ -1,6 +1,27 @@ import { DOCUMENT_COVERS } from '@think/constants'; const preloadImage = (url) => { + // @ts-ignore + window.requestIdleCallback = + window.requestIdleCallback || + function (cb) { + const start = Date.now(); + return setTimeout(function () { + cb({ + didTimeout: false, + timeRemaining: function () { + return Math.max(0, 50 - (Date.now() - start)); + }, + }); + }, 1); + }; + + window.cancelIdleCallback = + window.cancelIdleCallback || + function (id) { + clearTimeout(id); + }; + requestIdleCallback(() => { const image = document.createElement('img'); image.src = url; diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 6ee1f8d6..32846be4 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -133,6 +133,8 @@ importers: react-pdf: ^5.7.2 react-query: ^3.39.0 react-split-pane: ^0.1.92 + requestidlecallback-polyfill: ^1.0.2 + resize-observer-polyfill: ^1.5.1 scroll-into-view-if-needed: ^2.2.29 timeago.js: ^4.0.2 tippy.js: ^6.3.7 @@ -221,6 +223,8 @@ importers: react-pdf: 5.7.2_react-dom@17.0.2+react@17.0.2 react-query: 3.39.0_react-dom@17.0.2+react@17.0.2 react-split-pane: 0.1.92_react-dom@17.0.2+react@17.0.2 + requestidlecallback-polyfill: 1.0.2 + resize-observer-polyfill: 1.5.1 scroll-into-view-if-needed: 2.2.29 timeago.js: 4.0.2 tippy.js: 6.3.7 @@ -236,7 +240,7 @@ importers: eslint: 8.14.0 eslint-config-prettier: 8.5.0_eslint@8.14.0 eslint-plugin-import: 2.26.0_eslint@8.14.0 - eslint-plugin-prettier: 4.0.0_74ebb802163a9b4fa8f89d76ed02f62a + eslint-plugin-prettier: 4.0.0_740be41c8168d0cc214a306089357ad0 eslint-plugin-react: 7.29.4_eslint@8.14.0 eslint-plugin-react-hooks: 4.5.0_eslint@8.14.0 eslint-plugin-simple-import-sort: 7.0.0_eslint@8.14.0 @@ -5443,22 +5447,6 @@ packages: prettier-linter-helpers: 1.0.0 dev: true - /eslint-plugin-prettier/4.0.0_74ebb802163a9b4fa8f89d76ed02f62a: - resolution: {integrity: sha512-98MqmCJ7vJodoQK359bqQWaxOE0CS8paAz/GgjaZLyex4TTk3g9HugoO89EqWCrFiOqn9EVvcoo7gZzONCWVwQ==} - engines: {node: '>=6.0.0'} - peerDependencies: - eslint: '>=7.28.0' - eslint-config-prettier: '*' - prettier: '>=2.0.0' - peerDependenciesMeta: - eslint-config-prettier: - optional: true - dependencies: - eslint: 8.14.0 - eslint-config-prettier: 8.5.0_eslint@8.14.0 - prettier-linter-helpers: 1.0.0 - dev: true - /eslint-plugin-react-hooks/4.5.0_eslint@8.14.0: resolution: {integrity: sha512-8k1gRt7D7h03kd+SAAlzXkQwWK22BnK6GKZG+FJA6BAGy22CFvl8kCIXKpVux0cCxMWDQUPqSok0LKaZ0aOcCw==} engines: {node: '>=10'} @@ -9461,6 +9449,10 @@ packages: resolution: {integrity: sha1-CkPTqq4egNuRngeuJUsoXZ4ce7U=} dev: false + /requestidlecallback-polyfill/1.0.2: + resolution: {integrity: sha512-zzkRzvMe7UdV0M7AIU70vl2fh4rFnNYDL8U0ISwWiOX/5MowBV1ESYCWSQP/KsgJNUOC/AS6X3DApOmxoyE6MA==} + dev: false + /require-directory/2.1.1: resolution: {integrity: sha1-jGStX9MNqxyXbiNE/+f3kqam30I=} engines: {node: '>=0.10.0'}