<p>我正在尝试创建 Lightshow，它将同时在所有用户的移动设备上启动（最多可以有 2000-3000 个用户）。所有用户都将使用互联网（Wi-Fi 或移动数据）。在我们的 FE，我们使用 Apollo 进行订阅，这就像一个魅力。</p> <p>但问题是，用户 A 可以比用户 B 更快地获取订阅事件。这意味着用户 A 将比用户 B 更早开始玩游戏，这是一个问题，因为我们有 lighshow 架构，而用户可以'不能早点或晚点开始。作为用户，您会立即看到差异，而且看起来不太好。</p> <p>我看到的是延迟差异可以达到300ms。 android (小米 9) 与 ios (iPhone11) 之间的时间大多约为 180ms+-。如果我们比较两台 iOS 设备 iPhone 11 和 iPhone 13，差异约为 50-100 毫秒。对于所有设备，有没有办法消除这种差异，或者至少将其降低到 40-60 毫秒？</p> <p>从 BE 开始，我们发送服务器时间（utc+0），灯光秀将以时间戳开始 => 在 FE 中，我添加 10 秒来为所有设备提供解决该功能的时间，因此启动被延迟 -> "时间戳 + 10 秒”。</p> <p>在 FE 中，我使用库“react-native-ntp-client”在所有类型的设备上获得相同的时间（ios/android，因为我发现每个设备的时间略有不同）。然后我计算“start”和“ntpTime”之间的差异，并将其作为超时提供给我的 setTimeout 函数，这将触发灯光秀的开始。</p> <p>下面我提供了示例，说明我如何使用灯光秀所在的屏幕。</p> <pre class="brush:php;toolbar:false;">import dayjs from 'dayjs'; import ntpClient from 'react-native-ntp-client'; export const LightshowScreen: React.FC< LightshowScreenProps<'Lightshow'> > = ({route}) => { const {data, loading} = useSubscription(JOIN_LIGHTSHOW_SUBSCRIPTION, { variables: {lightshowId: route.params.lightshow.id}, }); useEffect(() => { const getServerTime = async (lightshowStartAt: number) => { // Delay start 10s to provide enough time to finish our functions - lightshowStartAt is timestamp from our server const lightshowStart = dayjs.unix(lightshowStartAt).add(10, 's'); ntpClient.getNetworkTime('time.cloudflare.com', 123, (error, date) => { if (error) { console.error('Cant connect', error); return; } console.log('NTP client date - ', date); // Mon Jul 08 2013 21:31:31 GMT+0200 (Paris, Madrid (heure d’été)) let ntpTime = dayjs(date); // Diff in ms const diff = lightshowStart.diff(ntpTime); // After this timeout all devices should start play at the same time setTimeout(() => { lightshowStartHandler(); }, diff); }); }; if (data && data?.joinLightshow.started) { const lightshowData = data.lightshow; getServerTime(lightshowData.startedAt); } }, [data]); useEffect(() => { if (data && data?.joinLightshow?.finished) { lightshowFinishHandler(); } }, [data]); return ( <View style={style.container}> .... </View> ); };</pre> <p>感谢您的所有评论和想法;)</p>