@@ -171,14 +171,7 @@ function App() {
171
171
// This stuff is just to tweak our sandbox setup in real-time
172
172
const [ loaderDelay , setLoaderDelay ] = useSessionStorage ( 'loaderDelay' , 500 )
173
173
const [ actionDelay , setActionDelay ] = useSessionStorage ( 'actionDelay' , 500 )
174
- const [ defaultPendingMs , setDefaultPendingMs ] = useSessionStorage (
175
- 'defaultPendingMs' ,
176
- 2000 ,
177
- )
178
- const [ defaultPendingMinMs , setDefaulPendingMinMs ] = useSessionStorage (
179
- 'defaultPendingMinMs' ,
180
- 500 ,
181
- )
174
+
182
175
const [ defaultLoaderMaxAge , setDefaultLoaderMaxAge ] = useSessionStorage (
183
176
'defaultLoaderMaxAge' ,
184
177
5000 ,
@@ -204,35 +197,7 @@ function App() {
204
197
className = "w-full"
205
198
/>
206
199
</ div >
207
- < div >
208
- Default Pending Ms: { defaultPendingMs } ms{ ' ' }
209
- { defaultPendingMs > loaderDelay ? < > 🔴</ > : < > 🟢</ > }
210
- </ div >
211
- < div >
212
- < input
213
- type = "range"
214
- min = "0"
215
- max = "5000"
216
- step = "100"
217
- value = { defaultPendingMs }
218
- onChange = { ( e ) => setDefaultPendingMs ( e . target . valueAsNumber ) }
219
- className = "w-full"
220
- />
221
- </ div >
222
- < div className = { `${ ! defaultPendingMs ? 'opacity-30' : '' } ` } >
223
- < div > Default Min Pending Ms: { defaultPendingMinMs } ms</ div >
224
- < div >
225
- < input
226
- type = "range"
227
- min = "0"
228
- max = "5000"
229
- step = "100"
230
- value = { defaultPendingMinMs }
231
- onChange = { ( e ) => setDefaulPendingMinMs ( e . target . valueAsNumber ) }
232
- className = { `w-full` }
233
- />
234
- </ div >
235
- </ div >
200
+
236
201
< div > Action Delay: { actionDelay } ms</ div >
237
202
< div >
238
203
< input
@@ -288,17 +253,11 @@ function App() {
288
253
defaultPreload = "intent"
289
254
defaultLoaderMaxAge = { defaultLoaderMaxAge }
290
255
defaultPreloadMaxAge = { defaultPreloadMaxAge }
291
- defaultPendingMs = { defaultPendingMs }
292
- defaultPendingMinMs = { defaultPendingMinMs }
293
256
// defaultLoaderMaxAge={5 * 1000}
294
257
// defaultLoaderGcMaxAge={10 * 1000}
295
258
// Normally, the options above aren't changing, but for this particular
296
259
// example, we need to key the router when they change
297
- key = { [
298
- defaultPreloadMaxAge ,
299
- defaultPendingMs ,
300
- defaultPendingMinMs ,
301
- ] . join ( '.' ) }
260
+ key = { [ defaultPreloadMaxAge ] . join ( '.' ) }
302
261
>
303
262
< Root />
304
263
</ RouterProvider >
@@ -398,9 +357,7 @@ function Home() {
398
357
elements are ready.
399
358
< hr className = { `my-2` } />
400
359
To exaggerate async effects, play with the artificial request delay
401
- slider in the bottom-left corner. You can also play with the default
402
- timings for displaying the pending fallbacks and the minimum time any
403
- pending fallbacks will remain shown.
360
+ slider in the bottom-left corner.
404
361
< hr className = { `my-2` } />
405
362
The last 2 sliders determine if link-hover preloading is enabled (and
406
363
how long those preloads stick around) and also whether to cache rendered
0 commit comments