Makussu/subtracks
1
0
Fork 0
mirror of https://github.com/austinried/subtracks.git synced 2026-02-10 15:02:42 +01:00
Code Issues Packages Projects Releases Wiki Activity

do memoizing better

Browse Source
This commit is contained in:
austinried
2021-07-13 09:46:55 +09:00
parent 38530134fd
commit 13ae61f160
3 changed files with 20 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
app/screens/Home.tsx
View File

@@ -10,9 +10,9 @@ import { useAtomValue } from 'jotai/utils'
import React from 'react'
import { ScrollView, StatusBar, StyleSheet, Text, View } from 'react-native'
const AlbumItem: React.FC<{
const AlbumItem = React.memo<{
album: AlbumListItem
}> = ({ album }) => {
}>(({ album }) => {
const navigation = useNavigation()
return (
@@ -34,13 +34,12 @@ const AlbumItem: React.FC<{
</Text>
</PressableOpacity>
)
}
const MemoAlbumItem = React.memo(AlbumItem)
})
const Category: React.FC<{
const Category = React.memo<{
name: string
type: string
}> = ({ name, type }) => {
}>(({ name, type }) => {
const state = albumLists[type]
const list = useAtomValue(state.listAtom)
const updating = useAtomValue(state.updatingAtom)
@@ -58,22 +57,21 @@ const Category: React.FC<{
style={styles.artScroll}
contentContainerStyle={styles.artScrollContent}>
{list.map(album => (
<MemoAlbumItem key={album.id} album={album} />
<AlbumItem key={album.id} album={album} />
))}
</ScrollView>
</View>
)
}
const MemoCategory = React.memo(Category)
})
const Home = () => (
<GradientScrollView style={styles.scroll} contentContainerStyle={styles.scrollContentContainer}>
<View style={styles.content}>
<MemoCategory name="Random Albums" type="random" />
<MemoCategory name="Newest Albums" type="newest" />
<MemoCategory name="Recent Albums" type="recent" />
<MemoCategory name="Frequent Albums" type="frequent" />
<MemoCategory name="Starred Albums" type="starred" />
<Category name="Random Albums" type="random" />
<Category name="Newest Albums" type="newest" />
<Category name="Recent Albums" type="recent" />
<Category name="Frequent Albums" type="frequent" />
<Category name="Starred Albums" type="starred" />
</View>
</GradientScrollView>
)

9
app/screens/LibraryAlbums.tsx
View File

@@ -10,14 +10,14 @@ import { useAtomValue } from 'jotai/utils'
import React, { useEffect } from 'react'
import { StyleSheet, Text, useWindowDimensions, View } from 'react-native'
const AlbumItem: React.FC<{
const AlbumItem = React.memo<{
id: string
name: string
size: number
height: number
artist?: string
coverArtUri?: string
}> = ({ id, name, artist, size, height, coverArtUri }) => {
}>(({ id, name, artist, size, height, coverArtUri }) => {
const navigation = useNavigation()
return (
@@ -35,13 +35,12 @@ const AlbumItem: React.FC<{
</View>
</PressableOpacity>
)
}
const MemoAlbumItem = React.memo(AlbumItem)
})
const AlbumListRenderItem: React.FC<{
item: { album: Album; size: number; height: number }
}> = ({ item }) => (
<MemoAlbumItem
<AlbumItem
id={item.album.id}
coverArtUri={item.album.coverArtThumbUri}
name={item.album.name}