Only refresh the slider when needed

This commit is contained in:
2026-07-16 12:46:57 +02:00
parent f9a95a7c51
commit e84430f3c0
3 changed files with 11 additions and 5 deletions
+2 -2
View File
@@ -44,7 +44,7 @@
"react-native-localization-settings": "^1.2.0",
"react-native-mmkv": "^4.3.1",
"react-native-nitro-modules": "^0.35.7",
"react-native-omni": "^1.0.2",
"react-native-omni": "^1.0.3",
"react-native-pager-view": "8.0.1",
"react-native-reanimated": "4.3.1",
"react-native-safe-area-context": "~5.7.0",
@@ -1292,7 +1292,7 @@
"react-native-nitro-modules": ["react-native-nitro-modules@0.35.7", "", { "peerDependencies": { "react": "*", "react-native": "*" } }, "sha512-3EiU27EmnxTlD3pAXR2OBWeDg7+9tdjKrNQOPX08rFX5hJPNIT/h1i2PjvTUieOypCGTEi9nW/SNBtK3F+4HYg=="],
"react-native-omni": ["react-native-omni@1.0.2", "", { "dependencies": { "@expo/config-plugins": "^57.0.3", "@videojs/react": "10.0.0-beta.25", "jassub": "^2.5.7", "libpgs": "^0.8.1" }, "peerDependencies": { "react": ">=19.0.0", "react-native": ">=0.86.0", "react-native-nitro-modules": ">=0.36.0" } }, "sha512-Q9EPdtW7niEQrouIQIrDMdmbb4bgLlXV1JfxXbVUn+we76dlKNPDhg7vqba3tTfZPkACPRyWdFlV9scEksujdA=="],
"react-native-omni": ["react-native-omni@1.0.3", "", { "dependencies": { "@expo/config-plugins": "^57.0.3", "@videojs/react": "10.0.0-beta.25", "jassub": "^2.5.7", "libpgs": "^0.8.1" }, "peerDependencies": { "react": ">=19.0.0", "react-native": ">=0.86.0", "react-native-nitro-modules": ">=0.36.0" } }, "sha512-gEOOmSbX/mMBgZENo1toxml08njrgwblYLuywi3VRFV8gv7q1SQwh99bhAXJMLTQfXT0kRO3lop6AMUHeqyA1Q=="],
"react-native-pager-view": ["react-native-pager-view@8.0.1", "", { "peerDependencies": { "react": "*", "react-native": "*" } }, "sha512-pGOne2o0y0HOQLrlTLcGgOE48uJlqSZHRRwdW8nL6JJozMkPGJYi/G9e0EsJoWFpXYONjiDgr8IwxC4F6/r7Lg=="],
+1 -1
View File
@@ -55,7 +55,7 @@
"react-native-localization-settings": "^1.2.0",
"react-native-mmkv": "^4.3.1",
"react-native-nitro-modules": "^0.35.7",
"react-native-omni": "^1.0.2",
"react-native-omni": "^1.0.3",
"react-native-pager-view": "8.0.1",
"react-native-reanimated": "4.3.1",
"react-native-safe-area-context": "~5.7.0",
+8 -2
View File
@@ -1,5 +1,5 @@
import { type CSSProperties, useState } from "react";
import type { TextProps } from "react-native";
import { type TextProps, useWindowDimensions } from "react-native";
import { usePlayer, usePlayerState } from "react-native-omni";
import { useResolveClassNames } from "uniwind";
import type { Chapter } from "~/models";
@@ -22,7 +22,13 @@ export const ProgressBar = ({
const { data } = useFetch(Info.infoQuery(slug));
const player = usePlayer();
const progress = usePlayerState("currentTime");
// only refresh when the slider would visually move by ~1px (once per second
// at most), instead of every second regardless of the video's length.
const { width } = useWindowDimensions();
const refreshInterval = data?.durationSeconds
? Math.max(1, data.durationSeconds / width)
: 1;
const progress = usePlayerState("currentTime", refreshInterval);
const buffer = usePlayerState("buffered");
const [hoverProgress, setHoverProgress] = useState<number | null>(null);