Skip to content

Commit 6066c8c

Browse files
committed
Minor performance improvements
1 parent 046269e commit 6066c8c

File tree

5 files changed

+312
-320
lines changed

5 files changed

+312
-320
lines changed

App.tsx

Lines changed: 27 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import "expo-dev-client";
2-
import { useEffect, useState } from "react";
2+
import { useCallback, useEffect, useState } from "react";
33
import {
44
FlatList,
55
StyleSheet,
@@ -8,6 +8,7 @@ import {
88
} from "react-native";
99
import * as SplashScreen from "expo-splash-screen";
1010
import { GestureHandlerRootView } from "react-native-gesture-handler";
11+
import { initialWindowMetrics, SafeAreaProvider, useSafeAreaInsets } from "react-native-safe-area-context";
1112

1213
import Button from "./components/button";
1314
import color from "./constants/colors";
@@ -22,7 +23,7 @@ import { ExpoDevMenuItem, registerDevMenuItems } from "expo-dev-menu";
2223
import AsyncStorage, { useAsyncStorage } from "@react-native-async-storage/async-storage";
2324
import { useAsyncStorageDevTools } from "@dev-plugins/async-storage";
2425

25-
// SplashScreen.preventAutoHideAsync();
26+
SplashScreen.preventAutoHideAsync();
2627

2728
SplashScreen.setOptions({
2829
fade: true,
@@ -42,7 +43,7 @@ export default function App() {
4243
useAsyncStorageDevTools({ errorHandler: (e) => { console.log("[App.js] -> Error:", e) } });
4344

4445
const { getItem, removeItem, setItem } = useAsyncStorage("tasks");
45-
46+
const [loaded, setLoaded] = useState(false);
4647
const [tasks, setTasks] = useState<TaskItem[] | undefined>(undefined);
4748
const [taskToEdit, setTaskToEdit] = useState<number | undefined>();
4849
const [creationModalVisible, setCreationModalVisible] = useState(false);
@@ -52,11 +53,12 @@ export default function App() {
5253
if (e !== null) {
5354
setTasks(JSON.parse(e));
5455
}
56+
setLoaded(true);
5557
}).catch((err) => console.log("[App.tsx] -> Something went wrong: ", err))
5658
}
5759

5860
async function saveTasks() {
59-
await setItem(JSON.stringify(tasks)).then((v) => console.log("[App.tsx] -> Saved successfully: ", tasks))
61+
await setItem(JSON.stringify(tasks));
6062
}
6163

6264
function createTask(t: TaskItem) {
@@ -68,7 +70,7 @@ export default function App() {
6870
}
6971

7072
function deleteTask(id: number) {
71-
setTasks(prevTasks => prevTasks?.filter((_, idx) => id !== idx));
73+
setTasks((prevTasks) => prevTasks?.filter((_, idx) => id !== idx));
7274
}
7375

7476
useEffect(() => {
@@ -101,15 +103,13 @@ export default function App() {
101103
{
102104
name: "Generate 25 random tasks",
103105
callback: () => {
104-
for (let i = 0; i <= 25; i++) {
105-
setTasks(() => tasks ? [...tasks, {
106-
title: Math.random().toString(),
107-
completed: Math.random() > 0.5 ? true : false,
108-
}] : [{
106+
const Arr = Array.from({ length: 25 }, () => {
107+
return {
109108
title: Math.random().toString(),
110109
completed: Math.random() > 0.5 ? true : false,
111-
}])
112-
}
110+
}
111+
})
112+
setTasks(() => tasks !== undefined ? [...tasks, ...Arr] : [...Arr])
113113
},
114114
shouldCollapse: true,
115115
}
@@ -137,21 +137,23 @@ export default function App() {
137137
);
138138
};
139139

140-
// const onLayoutRootView = useCallback(() => {
141-
// if (loaded) {
142-
// SplashScreen.hide();
143-
// }
144-
// }, [loaded]);
140+
const onLayoutRootView = useCallback(() => {
141+
if (loaded) {
142+
SplashScreen.hide();
143+
}
144+
}, [loaded]);
145145

146-
// if (!loaded) {
147-
// return null;
148-
// }
146+
if (!loaded) {
147+
return null;
148+
}
149149

150150
return (
151+
// <SafeAreaProvider initialMetrics={initialWindowMetrics}>
151152
<GestureHandlerRootView
152-
// onLayout={onLayoutRootView}
153+
onLayout={onLayoutRootView}
153154
style={styles.container}
154155
>
156+
155157
{/* this doohickey is to force the modal to rerender again so that the taskToEdit actually goes through */}
156158

157159
{/* creationModalVisible */}
@@ -183,8 +185,8 @@ export default function App() {
183185
ListEmptyComponent={NoTasks}
184186
ListHeaderComponent={ListHeader}
185187
ListHeaderComponentStyle={{ width: "100%" }}
186-
StickyHeaderComponent={ListHeader}
187-
stickyHeaderHiddenOnScroll
188+
// StickyHeaderComponent={ListHeader}
189+
// stickyHeaderHiddenOnScroll
188190
stickyHeaderIndices={[0]}
189191
/>
190192
</View>
@@ -199,7 +201,9 @@ export default function App() {
199201
setCreationModalVisible(true);
200202
}}
201203
/>
204+
202205
</GestureHandlerRootView>
206+
// </SafeAreaProvider>
203207
);
204208
}
205209

app.json

Lines changed: 61 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,62 +1,63 @@
11
{
2-
"expo": {
3-
"name": "TickOff",
4-
"slug": "TickOff",
5-
"version": "0.0.2-alpha",
6-
"orientation": "portrait",
7-
"icon": "./assets/icon.png",
8-
"userInterfaceStyle": "automatic",
9-
"newArchEnabled": true,
10-
"splash": {
11-
"image": "./assets/splash-icon.png",
12-
"resizeMode": "contain",
13-
"backgroundColor": "#021526"
14-
},
15-
"plugins": [
16-
[
17-
"expo-dev-client"
18-
],
19-
"expo-font",
20-
[
21-
"expo-splash-screen",
22-
{
23-
"image": "./assets/splash-icon.png",
24-
"backgroundColor": "#6eacda",
25-
"dark": {
26-
"image": "./assets/splash-icon-dark.png",
27-
"backgroundColor": "#021526"
28-
},
29-
"imageWidth": 200
30-
}
31-
]
32-
],
33-
"ios": {
34-
"supportsTablet": true
35-
},
36-
"android": {
37-
"adaptiveIcon": {
38-
"foregroundImage": "./assets/adaptive-icon.png",
39-
"backgroundImage": "./assets/adaptive-icon-background.png",
40-
"monochromeImage": "./assets/mono-icon.png",
41-
"backgroundColor": "#021526"
42-
},
43-
"edgeToEdgeEnabled": true,
44-
"package": "com.sai.tickoff_beta"
45-
},
46-
"web": {
47-
"favicon": "./assets/favicon.png"
48-
},
49-
"extra": {
50-
"eas": {
51-
"projectId": "7d4b3f35-459c-44b3-bd71-511601384305"
52-
}
53-
},
54-
"owner": "saismaranvijayagiri2008",
55-
"runtimeVersion": {
56-
"policy": "appVersion"
57-
},
58-
"updates": {
59-
"url": "https://u.expo.dev/7d4b3f35-459c-44b3-bd71-511601384305"
60-
}
61-
}
2+
"expo": {
3+
"name": "TickOff",
4+
"slug": "TickOff",
5+
"version": "0.0.2-alpha",
6+
"orientation": "portrait",
7+
"icon": "./assets/icon.png",
8+
"jsEngine": "hermes",
9+
"userInterfaceStyle": "automatic",
10+
"newArchEnabled": true,
11+
"splash": {
12+
"image": "./assets/splash-icon.png",
13+
"resizeMode": "contain",
14+
"backgroundColor": "#021526"
15+
},
16+
"plugins": [
17+
[
18+
"expo-dev-client"
19+
],
20+
"expo-font",
21+
[
22+
"expo-splash-screen",
23+
{
24+
"image": "./assets/splash-icon.png",
25+
"backgroundColor": "#6eacda",
26+
"dark": {
27+
"image": "./assets/splash-icon-dark.png",
28+
"backgroundColor": "#021526"
29+
},
30+
"imageWidth": 200
31+
}
32+
]
33+
],
34+
"ios": {
35+
"supportsTablet": true
36+
},
37+
"android": {
38+
"adaptiveIcon": {
39+
"foregroundImage": "./assets/adaptive-icon.png",
40+
"backgroundImage": "./assets/adaptive-icon-background.png",
41+
"monochromeImage": "./assets/mono-icon.png",
42+
"backgroundColor": "#021526"
43+
},
44+
"edgeToEdgeEnabled": true,
45+
"package": "com.sai.tickoff_beta"
46+
},
47+
"web": {
48+
"favicon": "./assets/favicon.png"
49+
},
50+
"extra": {
51+
"eas": {
52+
"projectId": "7d4b3f35-459c-44b3-bd71-511601384305"
53+
}
54+
},
55+
"owner": "saismaranvijayagiri2008",
56+
"runtimeVersion": {
57+
"policy": "appVersion"
58+
},
59+
"updates": {
60+
"url": "https://u.expo.dev/7d4b3f35-459c-44b3-bd71-511601384305"
61+
}
62+
}
6263
}

components/checkbox.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,6 @@ const styles = StyleSheet.create({
7575
borderWidth: 2,
7676
borderRadius: 5,
7777
borderColor: color.ter,
78-
filter: "drop-shadow(0px 0px 10px black);",
78+
// filter: "drop-shadow(0px 0px 10px black);",
7979
},
8080
});

ui/createTask.tsx

Lines changed: 3 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -60,9 +60,9 @@ export default function CreateTask({
6060
hardwareAccelerated
6161
statusBarTranslucent
6262
onShow={() => {
63-
console.log("[CreateTask] -> editing task of index", taskToEdit);
64-
console.log("[CreateTask] ->", tasks !== undefined && taskToEdit !== undefined ? tasks[taskToEdit].title : null);
65-
console.log("[CreateTask] ->","Title: "+ title,"Sub-tasks: "+ subTasks);
63+
// console.log("[CreateTask] -> editing task of index", taskToEdit);
64+
// console.log("[CreateTask] ->", tasks !== undefined && taskToEdit !== undefined ? tasks[taskToEdit].title : null);
65+
// console.log("[CreateTask] ->","Title: "+ title,"Sub-tasks: "+ subTasks);
6666
inputRef.current?.focus();
6767
if (taskToEdit !== undefined) {
6868
setTitle(tasks !== undefined && taskToEdit !== undefined ? tasks[taskToEdit].title : "")
@@ -190,23 +190,6 @@ export default function CreateTask({
190190
<TouchableOpacity
191191
onPress={async () => {
192192
if (title?.length !== 0) {
193-
194-
// if (taskIDtoEdit) {
195-
// updateTask(taskIDtoEdit, {
196-
// title,
197-
// subTasks: subTaskList,
198-
// //@ts-ignore
199-
// completed: tasks[taskIDtoEdit].completed,
200-
// });
201-
// } else {
202-
// createTask({
203-
// title,
204-
// subTasks: subTaskList,
205-
// completed: false,
206-
// });
207-
// }
208-
// setTitle("");
209-
// setSubTasks(undefined);
210193
onSubmitEditing(taskToEdit, subTasks !== undefined ? {
211194
title,
212195
subTasks: subTasks,

0 commit comments

Comments
 (0)