Bump expiration for interactive updates to 150ms in production (#12599)
* Bump expiration for interactive updates to 150ms in production **what is the change?:** Changes the expiration deadline from 500ms to 150ms, only in production. In development it will still be 500ms. I'm thinking we may want to change the 'bucket size' too, will look into that a bit. **why make this change?:** We need to ensure interactions are responsive enough in order to gather more test data on async. mode. **test plan:** No tests failed - where shall we add a test for this? * Add comments
Flarnie Marchan committed
Apr 11, 2018 at 07:27 UTC
915bb5321a8db3435eb36ef1cf9414c15333b447
1 file changed
+16
-2
packages/react-reconciler/src/ReactFiberScheduler.js
+16
-2
@@ -1094,8 +1094,22 @@ export default function<T, P, I, TI, HI, PI, C, CC, CX, PL>(
1094
}
1095
1096
function computeInteractiveExpiration(currentTime: ExpirationTime) {
1097
- // Should complete within ~500ms. 600ms max.
1098
- const expirationMs = 500;
1097
+ let expirationMs;
1098
+ // We intentionally set a higher expiration time for interactive updates in
1099
+ // dev than in production.
1100
+ // If the main thread is being blocked so long that you hit the expiration,
1101
+ // it's a problem that could be solved with better scheduling.
1102
+ // People will be more likely to notice this and fix it with the long
1103
+ // expiration time in development.
1104
+ // In production we opt for better UX at the risk of masking scheduling
1105
+ // problems, by expiring fast.
1106
+ if (__DEV__) {
1107
+ // Should complete within ~500ms. 600ms max.
1108
+ expirationMs = 500;
1109
+ } else {
1110
+ // In production things should be more responsive, 150ms max.
1111
+ expirationMs = 150;
1112
+ }
1113
const bucketSizeMs = 100;
1114
return computeExpirationBucket(currentTime, expirationMs, bucketSizeMs);
1115
}