From 80913e6caa0c0540e5fd833d918259d41385c25c Mon Sep 17 00:00:00 2001
From: wudingfeng <myqq12345@outlook.com>
Date: Wed, 6 Dec 2023 20:34:54 +0800
Subject: [PATCH] perf: improve performance

---
 packages/web/pages/Artist/ArtistSongs.tsx  | 7 +++----
 packages/web/pages/Artist/ArtistVideos.tsx | 5 +++--
 packages/web/pages/Browse/Browse.tsx       | 7 -------
 3 files changed, 6 insertions(+), 13 deletions(-)

diff --git a/packages/web/pages/Artist/ArtistSongs.tsx b/packages/web/pages/Artist/ArtistSongs.tsx
index 54973e0..7ba9379 100644
--- a/packages/web/pages/Artist/ArtistSongs.tsx
+++ b/packages/web/pages/Artist/ArtistSongs.tsx
@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react'
+import { memo, useEffect, useState } from 'react'
 import useArtistSongs from '@/web/api/hooks/useArtistSongs'
 import useTracks from '@/web/api/hooks/useTracks'
 import { FetchArtistSongsParams } from '@/shared/api/Artist'
@@ -8,9 +8,8 @@ import { useParams } from 'react-router-dom'
 import ScrollPagination from '@/web/components/ScrollPage'
 import { fetchArtistSongs } from '@/web/api/artist'
 import { fetchTracks } from '@/web/api/track'
-import toast from 'react-hot-toast'
 
-const ArtistSongs = () => {
+const ArtistSongs = memo(() => {
   const [dataSource, setDatasource] = useState<Track[]>([])
   const [songIDs, setSongIDs] = useState<number[]>([])
   const params = useParams()
@@ -54,6 +53,6 @@ const ArtistSongs = () => {
       <ScrollPagination getData={getData} renderItems={renderItems} />
     </div>
   )
-}
+})
 
 export default ArtistSongs
diff --git a/packages/web/pages/Artist/ArtistVideos.tsx b/packages/web/pages/Artist/ArtistVideos.tsx
index 87c7644..150c93a 100644
--- a/packages/web/pages/Artist/ArtistVideos.tsx
+++ b/packages/web/pages/Artist/ArtistVideos.tsx
@@ -2,8 +2,9 @@ import { useParams } from 'react-router-dom'
 import useArtistMV from '@/web/api/hooks/useArtistMV'
 import { useTranslation } from 'react-i18next'
 import uiStates from '@/web/states/uiStates'
+import { memo } from 'react'
 
-const ArtistVideos = () => {
+const ArtistVideos = memo(() => {
   const { t } = useTranslation()
   const params = useParams()
   const { data: videos } = useArtistMV({ id: Number(params.id) || 0 })
@@ -31,6 +32,6 @@ const ArtistVideos = () => {
       </div>
     </div>
   )
-}
+})
 
 export default ArtistVideos
diff --git a/packages/web/pages/Browse/Browse.tsx b/packages/web/pages/Browse/Browse.tsx
index 80b364e..24dbd28 100644
--- a/packages/web/pages/Browse/Browse.tsx
+++ b/packages/web/pages/Browse/Browse.tsx
@@ -1,14 +1,7 @@
 import Tabs from '@/web/components/Tabs'
-import { fetchDailyRecommendPlaylists, fetchRecommendedPlaylists } from '@/web/api/playlist'
-import { PlaylistApiNames } from '@/shared/api/Playlists'
 import { useState } from 'react'
-import { useQuery } from '@tanstack/react-query'
-import CoverRowVirtual from '@/web/components/CoverRowVirtual'
 import PageTransition from '@/web/components/PageTransition'
-import { playerWidth, topbarHeight } from '@/web/utils/const'
 import { cx, css } from '@emotion/css'
-import CoverRow from '@/web/components/CoverRow'
-import topbarBackground from '@/web/assets/images/topbar-background.png'
 import Recommend from './Recommend'
 import Top from './Top'
 import Hot from './Hot'