Przeglądaj źródła

fix: 优化一些性能

ansoni 2 miesięcy temu
rodzic
commit
baf9767fc6

+ 10 - 21
.env.local

@@ -1,24 +1,13 @@
-# 环境
 #baseurl
-# NEXT_PUBLIC_BASE_URL=http://192.168.0.71:8800
-NEXT_PUBLIC_BASE_URL=http://192.168.0.84:8800
-# NEXT_PUBLIC_BASE_URL=https://3rd-api.tiktokjakjkl.icu
+NEXT_PUBLIC_BASE_URL=https://hk-api.tiktokjakjkl.icu
 #share link
-NEXT_PUBLIC_SHARE_URL=http://192.168.0.84:3000
-
+NEXT_PUBLIC_SHARE_URL=https://hk-site.tiktokjakjkl.icu
 #firebase
-NEXT_PUBLIC_FIREBASE_APIKEY=AIzaSyDAWORGKhdyzb5KeqTi535VmD5gN2Cdle8
-NEXT_PUBLIC_FIREBASE_AUTHDOMAIN=bcwin-a99b1.firebaseapp.com
-
-
-
-
-NEXT_PUBLIC_FIREBASE_PROJECTID=bcwin-a99b1
-NEXT_PUBLIC_FIREBASE_STORAGEBUCKET=bcwin-a99b1.appspot.com
-NEXT_PUBLIC_FIREBASE_MESSAGINGSENDERID=1055413612814
-NEXT_PUBLIC_FIREBASE_APPID=1:1055413612814:web:7a563237de8e43849d275f
-
-
-
-NEXT_PUBLIC_FIREBASE_MEASUREMENTID=G-467M2BYJMS
-NEXT_PUBLIC_FIREBASE_KEYS=BAOsT7kii-ctLzGrgXe_wYhfuxlme1v4njnD0uPSKp3DpSnrUa2e709b9dRaeYVU7jF_qIx1y9tEv0CvilDCdnM
+NEXT_PUBLIC_FIREBASE_APIKEY=AIzaSyCIE8xtySsYztsSgmQJx_aqPrrpHEuvgvw
+NEXT_PUBLIC_FIREBASE_AUTHDOMAIN=bcwin777-1bdda.firebaseapp.com
+NEXT_PUBLIC_FIREBASE_PROJECTID=bcwin777-1bdda
+NEXT_PUBLIC_FIREBASE_STORAGEBUCKET=bcwin777-1bdda.firebasestorage.app
+NEXT_PUBLIC_FIREBASE_MESSAGINGSENDERID=542456379513
+NEXT_PUBLIC_FIREBASE_APPID=1:542456379513:web:851a46fc639085170bfca8
+NEXT_PUBLIC_FIREBASE_MEASUREMENTID=G-GV6Y8DXHHD
+NEXT_PUBLIC_FIREBASE_KEYS=BOCfpA08vK6uxhMdRblnx9gPVBLx9WpTn9AutVNhHQQpVtXzDIKW0X6cmsNRaFDhyFDJfMqWjqC7mq6uDFIKU_M

+ 1 - 0
src/app/[locale]/(TabBar)/[[...share]]/@prizeWidget/page.tsx

@@ -11,6 +11,7 @@ const getPrizeApi = () => {
 const Page = async () => {
     const result = await getPrizeApi();
     if (!result.data) return null;
+
     return <HomePrize data={result.data ?? []}></HomePrize>;
 };
 export default Page;

+ 0 - 3
src/app/[locale]/(TabBar)/[[...share]]/@swiperWidget/page.tsx

@@ -1,14 +1,12 @@
 import { BannerRep } from "@/api/home";
 import { server } from "@/utils/server";
 import HomeSwiper from "../_home/HomeSwiper";
-import { sleep } from "@/utils/methods";
 const getBanners = async () => {
     return server
         .request<BannerRep[]>({
             url: "/v1/api/front/banner_list",
             method: "POST",
             body: JSON.stringify({}),
-            next: { revalidate: 0 },
         })
         .then((res) => {
             if (res.code === 200) return res.data;
@@ -18,7 +16,6 @@ const getBanners = async () => {
 const Page = async () => {
     const banners = await getBanners();
 
-
     if (!banners.length) return null;
 
     return <HomeSwiper banners={banners}></HomeSwiper>;

+ 30 - 0
src/app/[locale]/(TabBar)/[[...share]]/Placeholder.tsx

@@ -0,0 +1,30 @@
+export const SwiperPlaceHolder = () => {
+    return (
+        <div
+            style={{ height: "1.86rem" }}
+            className={
+                "animate-pulse rounded-[0.1rem] border-[0.01rem] border-[#47aaae]" +
+                " overflow-hidden bg-[#e8e8e8]"
+            }
+        ></div>
+    );
+};
+
+export const NoticePlaceHolder = () => {
+    return <div className={"h-[0.36rem] animate-pulse bg-[#e8e8e8]"}></div>;
+};
+
+export const PrizePlaceHolder = () => {
+    return (
+        <div
+            className={
+                "grid h-[1.84rem] animate-pulse grid-cols-3 gap-[10px] rounded-[20px]" +
+                " p-[0.1389rem]"
+            }
+        >
+            <div className={"h-full rounded-[8px] bg-[#e8e8e8]"}></div>
+            <div className={"h-full rounded-[8px] bg-[#e8e8e8]"}></div>
+            <div className={"h-full rounded-[8px] bg-[#e8e8e8]"}></div>
+        </div>
+    );
+};

+ 14 - 31
src/app/[locale]/(TabBar)/[[...share]]/layout.tsx

@@ -5,8 +5,12 @@ import { FC, PropsWithChildren, ReactNode, Suspense } from "react";
 import DownloadSection from "./_home/DownloadSection";
 
 import { GroupType } from "@/api/home";
+import {
+    NoticePlaceHolder,
+    PrizePlaceHolder,
+    SwiperPlaceHolder,
+} from "@/app/[locale]/(TabBar)/[[...share]]/Placeholder";
 import { server } from "@/utils/server";
-import Loading from "@/components/Loading";
 
 const TIME = 0;
 const getGames = async () => {
@@ -44,12 +48,8 @@ type Props = {
 };
 
 const Placeholder = () => {
-  return (
-    <div className={'flex justify-center'}>
-      <Loading/>
-    </div>
-  )
-}
+    return <div className={"flex justify-center"}>{/*<Loading/>*/}</div>;
+};
 const Layout: FC<PropsWithChildren<Props>> = async (props) => {
     const {
         children,
@@ -73,26 +73,18 @@ const Layout: FC<PropsWithChildren<Props>> = async (props) => {
             <Header></Header>
             <main id="maincontainer" className={"main-header"}>
                 {/*弹窗*/}
-                <Suspense fallback={<Placeholder/>}>{popupWidget}</Suspense>
+                <Suspense fallback={<Placeholder />}>{popupWidget}</Suspense>
                 <Box>
                     {/* swiper */}
-                  <Suspense fallback={<Placeholder/>}
-                  >
-                    {swiperWidget}
-                  </Suspense>
+                    <Suspense fallback={<SwiperPlaceHolder />}>{swiperWidget}</Suspense>
                 </Box>
                 {/* swiper下的活动 */}
                 <Box none className="px-[.12rem]">
-                  <Suspense fallback={<Placeholder/>}>
                     {cardWidget}
-                  </Suspense>
                 </Box>
                 {/* 跑马灯 */}
                 <Box none className="px-[.12rem]">
-
-                  <Suspense fallback={<Placeholder/>}>
-                    {noticeWidget}
-                  </Suspense>
+                    <Suspense fallback={<NoticePlaceHolder />}>{noticeWidget}</Suspense>
                 </Box>
 
                 {/* <Box>
@@ -102,25 +94,18 @@ const Layout: FC<PropsWithChildren<Props>> = async (props) => {
                 {/*体育轮播*/}
                 {/* <Box> {sportSwiperWidget}</Box> */}
                 {/* 搜索下面的大奖展示 */}
-              <Suspense fallback={<Placeholder/>}>
-                {prizeWidget}
-              </Suspense>
+                <Suspense fallback={<PrizePlaceHolder />}>{prizeWidget}</Suspense>
 
                 {/* 搜索组件 */}
                 {/* <Box none className="mb-[.2rem] px-[.12rem]">
                         {searchWidget}
                     </Box> */}
                 {/* tabs 和 游戏列表 */}
-              <Suspense fallback={<Placeholder/>}>
-                {children}
-              </Suspense>
+                <Suspense fallback={<PrizePlaceHolder />}>{children}</Suspense>
 
                 {/*媒体*/}
                 <Box none className="mt-[.2rem]">
-
-                  <Suspense fallback={<Placeholder/>}>
-                    {mediaWidget}
-                  </Suspense>
+                    <Suspense fallback={<Placeholder />}>{mediaWidget}</Suspense>
                 </Box>
                 {/* {React.Children.map(children,(child:any)=>{
                     console.log(child)
@@ -129,9 +114,7 @@ const Layout: FC<PropsWithChildren<Props>> = async (props) => {
                 })} */}
                 {/* {React.cloneElement(children,{group})} */}
                 {/*底部信息*/}
-              <Suspense fallback={<Placeholder/>}>
-                {actionWidget}
-              </Suspense>
+                <Suspense fallback={<Placeholder />}>{actionWidget}</Suspense>
             </main>
         </>
     );

+ 6 - 2
src/app/[locale]/(TabBar)/profile/layout.tsx

@@ -1,6 +1,6 @@
 import HeaderBack from "@/components/HeaderBack";
 import { getTranslations } from "next-intl/server";
-import { ReactNode } from "react";
+import { ReactNode, Suspense } from "react";
 
 export const generateMetadata = async () => {
     const t = await getTranslations("titles");
@@ -18,7 +18,11 @@ export default async function LocaleLayout({
     return (
         <div className="profilPage h-[100%] overflow-auto bg-[url('/home/bg.jpg')]">
             <HeaderBack showBack={true} useBg={true} title="Perfil" />
-            <main className={"main-header"}>{children}</main>
+            <main className={"main-header"}>
+              <Suspense fallback={<div></div>}>
+                {children}
+              </Suspense>
+            </main>
         </div>
     );
 }

+ 6 - 2
src/app/[locale]/(TabBar)/promo/layout.tsx

@@ -1,6 +1,6 @@
 import HeaderBack from "@/components/HeaderBack";
 import { getTranslations } from "next-intl/server";
-import { ReactNode } from "react";
+import { ReactNode, Suspense } from "react";
 
 export default async function Layout({
     children,
@@ -13,7 +13,11 @@ export default async function Layout({
     return (
         <>
             <HeaderBack useBg={true} showBack={true} title={t("promocoes")} />
-            <main className={"main-header"}>{children}</main>
+            <main className={"main-header"}>
+              <Suspense fallback={<div></div>}>
+                {children}
+              </Suspense>
+            </main>
         </>
     );
 }

+ 0 - 1
src/app/[locale]/loading.tsx

@@ -1,4 +1,3 @@
-"use client";
 import Loading from "@/components/Loading";
 import { FC } from "react";
 interface Props {}