Rename Scheduler methods more accurately (#12770)
* Rename Scheduler methods more accurately **what is the change?:** ``` rIC -> scheduleCallback ``` We will later expose a second method for different priority level, name TBD. Since we only have one priority right now we can delay the bikeshedding about the priority names. cIC -> cancelScheduledCallback This method can be used to cancel callbacks scheduled at any priority level, and will remain named this way. why make this change?: Originally this module contained a polyfill for requestIdleCallback and cancelIdleCallback but we are changing the behavior so it's no longer just a polyfill. The new names are more semantic and distinguish this from the original polyfill functionality. **test plan:** Ran the tests **why make this change?:** Getting this out of the way so things are more clear. **Coming Up Next:** - Switching from a Map of ids and an array to a linked list for storing callbacks. - Error handling * callback -> work * update callsites in new places after rebase * fix typo
Flarnie Marchan committed
May 16, 2018 at 06:36 UTC
ef294ed6fcb7378ba25525e58e0588e3e8e85c48
4 files changed
+45
-45
packages/react-art/src/ReactARTHostConfig.js
+1
-1
@@ -319,7 +319,7 @@ const ReactARTHostConfig = {
319
return emptyObject;
320
},
321
322
- scheduleDeferredCallback: ReactScheduler.rIC,
322
+ scheduleDeferredCallback: ReactScheduler.scheduleWork,
323
324
shouldSetTextContent(type, props) {
325
return (
packages/react-dom/src/client/ReactDOMHostConfig.js
+2
-2
@@ -561,8 +561,8 @@ const ReactDOMHostConfig = {
561
},
562
},
563
564
- scheduleDeferredCallback: ReactScheduler.rIC,
565
- cancelDeferredCallback: ReactScheduler.cIC,
564
+ scheduleDeferredCallback: ReactScheduler.scheduleWork,
565
+ cancelDeferredCallback: ReactScheduler.cancelScheduledWork,
566
};
567
568
export default ReactDOMHostConfig;
packages/react-scheduler/src/ReactScheduler.js
+11
-11
@@ -13,7 +13,7 @@
13
* A scheduling library to allow scheduling work with more granular priority and
14
* control than requestAnimationFrame and requestIdleCallback.
15
* Current TODO items:
16
- * X- Pull out the rIC polyfill built into React
16
+ * X- Pull out the scheduleWork polyfill built into React
17
* X- Initial test coverage
18
* X- Support for multiple callbacks
19
* - Support for two priorities; serial and deferred
@@ -68,13 +68,13 @@ if (hasNativePerformanceNow) {
68
}
69
70
// TODO: There's no way to cancel, because Fiber doesn't atm.
71
-let rIC: (
71
+let scheduleWork: (
72
callback: (deadline: Deadline, options?: {timeout: number}) => void,
73
) => number;
74
-let cIC: (callbackID: number) => void;
74
+let cancelScheduledWork: (callbackID: number) => void;
75
76
if (!ExecutionEnvironment.canUseDOM) {
77
- rIC = function(
77
+ scheduleWork = function(
78
frameCallback: (deadline: Deadline, options?: {timeout: number}) => void,
79
): number {
80
return setTimeout(() => {
@@ -86,12 +86,12 @@ if (!ExecutionEnvironment.canUseDOM) {
86
});
87
});
88
};
89
- cIC = function(timeoutID: number) {
89
+ cancelScheduledWork = function(timeoutID: number) {
90
clearTimeout(timeoutID);
91
};
92
} else {
93
// We keep callbacks in a queue.
94
- // Calling rIC will push in a new callback at the end of the queue.
94
+ // Calling scheduleWork will push in a new callback at the end of the queue.
95
// When we get idle time, callbacks are removed from the front of the queue
96
// and called.
97
const pendingCallbacks: Array<CallbackConfigType> = [];
@@ -104,7 +104,7 @@ if (!ExecutionEnvironment.canUseDOM) {
104
105
// When a callback is scheduled, we register it by adding it's id to this
106
// object.
107
- // If the user calls 'cIC' with the id of that callback, it will be
107
+ // If the user calls 'cancelScheduledWork' with the id of that callback, it will be
108
// unregistered by removing the id from this object.
109
// Then we skip calling any callback which is not registered.
110
// This means cancelling is an O(1) time complexity instead of O(n).
@@ -265,7 +265,7 @@ if (!ExecutionEnvironment.canUseDOM) {
265
}
266
};
267
268
- rIC = function(
268
+ scheduleWork = function(
269
callback: (deadline: Deadline) => void,
270
options?: {timeout: number},
271
): number {
@@ -289,7 +289,7 @@ if (!ExecutionEnvironment.canUseDOM) {
289
if (!isAnimationFrameScheduled) {
290
// If rAF didn't already schedule one, we need to schedule a frame.
291
// TODO: If this rAF doesn't materialize because the browser throttles, we
292
- // might want to still have setTimeout trigger rIC as a backup to ensure
292
+ // might want to still have setTimeout trigger scheduleWork as a backup to ensure
293
// that we keep performing work.
294
isAnimationFrameScheduled = true;
295
requestAnimationFrame(animationTick);
@@ -297,9 +297,9 @@ if (!ExecutionEnvironment.canUseDOM) {
297
return newCallbackId;
298
};
299
300
- cIC = function(callbackId: number) {
300
+ cancelScheduledWork = function(callbackId: number) {
301
delete registeredCallbackIds[callbackId];
302
};
303
}
304
305
-export {now, rIC, cIC};
305
+export {now, scheduleWork, cancelScheduledWork};
packages/react-scheduler/src/__tests__/ReactScheduler-test.js
+31
-31
@@ -41,11 +41,11 @@ describe('ReactScheduler', () => {
41
ReactScheduler = require('react-scheduler');
42
});
43
44
- describe('rIC', () => {
44
+ describe('scheduleWork', () => {
45
it('calls the callback within the frame when not blocked', () => {
46
- const {rIC} = ReactScheduler;
46
+ const {scheduleWork} = ReactScheduler;
47
const cb = jest.fn();
48
- rIC(cb);
48
+ scheduleWork(cb);
49
jest.runAllTimers();
50
expect(cb.mock.calls.length).toBe(1);
51
// should not have timed out and should include a timeRemaining method
@@ -55,15 +55,15 @@ describe('ReactScheduler', () => {
55
56
describe('with multiple callbacks', () => {
57
it('accepts multiple callbacks and calls within frame when not blocked', () => {
58
- const {rIC} = ReactScheduler;
58
+ const {scheduleWork} = ReactScheduler;
59
const callbackLog = [];
60
const callbackA = jest.fn(() => callbackLog.push('A'));
61
const callbackB = jest.fn(() => callbackLog.push('B'));
62
- rIC(callbackA);
62
+ scheduleWork(callbackA);
63
// initially waits to call the callback
64
expect(callbackLog).toEqual([]);
65
// waits while second callback is passed
66
- rIC(callbackB);
66
+ scheduleWork(callbackB);
67
expect(callbackLog).toEqual([]);
68
// after a delay, calls as many callbacks as it has time for
69
jest.runAllTimers();
@@ -84,11 +84,11 @@ describe('ReactScheduler', () => {
84
'schedules callbacks in correct order and' +
85
'keeps calling them if there is time',
86
() => {
87
- const {rIC} = ReactScheduler;
87
+ const {scheduleWork} = ReactScheduler;
88
const callbackLog = [];
89
const callbackA = jest.fn(() => {
90
callbackLog.push('A');
91
- rIC(callbackC);
91
+ scheduleWork(callbackC);
92
});
93
const callbackB = jest.fn(() => {
94
callbackLog.push('B');
@@ -97,11 +97,11 @@ describe('ReactScheduler', () => {
97
callbackLog.push('C');
98
});
99
100
- rIC(callbackA);
100
+ scheduleWork(callbackA);
101
// initially waits to call the callback
102
expect(callbackLog).toEqual([]);
103
// continues waiting while B is scheduled
104
- rIC(callbackB);
104
+ scheduleWork(callbackB);
105
expect(callbackLog).toEqual([]);
106
// after a delay, calls the scheduled callbacks,
107
// and also calls new callbacks scheduled by current callbacks
@@ -110,18 +110,18 @@ describe('ReactScheduler', () => {
110
},
111
);
112
113
- it('schedules callbacks in correct order when callbacks have many nested rIC calls', () => {
114
- const {rIC} = ReactScheduler;
113
+ it('schedules callbacks in correct order when callbacks have many nested scheduleWork calls', () => {
114
+ const {scheduleWork} = ReactScheduler;
115
const callbackLog = [];
116
const callbackA = jest.fn(() => {
117
callbackLog.push('A');
118
- rIC(callbackC);
119
- rIC(callbackD);
118
+ scheduleWork(callbackC);
119
+ scheduleWork(callbackD);
120
});
121
const callbackB = jest.fn(() => {
122
callbackLog.push('B');
123
- rIC(callbackE);
124
- rIC(callbackF);
123
+ scheduleWork(callbackE);
124
+ scheduleWork(callbackF);
125
});
126
const callbackC = jest.fn(() => {
127
callbackLog.push('C');
@@ -136,8 +136,8 @@ describe('ReactScheduler', () => {
136
callbackLog.push('F');
137
});
138
139
- rIC(callbackA);
140
- rIC(callbackB);
139
+ scheduleWork(callbackA);
140
+ scheduleWork(callbackB);
141
// initially waits to call the callback
142
expect(callbackLog).toEqual([]);
143
// while flushing callbacks, calls as many as it has time for
@@ -145,23 +145,23 @@ describe('ReactScheduler', () => {
145
expect(callbackLog).toEqual(['A', 'B', 'C', 'D', 'E', 'F']);
146
});
147
148
- it('schedules callbacks in correct order when they use rIC to schedule themselves', () => {
149
- const {rIC} = ReactScheduler;
148
+ it('schedules callbacks in correct order when they use scheduleWork to schedule themselves', () => {
149
+ const {scheduleWork} = ReactScheduler;
150
const callbackLog = [];
151
let callbackAIterations = 0;
152
const callbackA = jest.fn(() => {
153
if (callbackAIterations < 1) {
154
- rIC(callbackA);
154
+ scheduleWork(callbackA);
155
}
156
callbackLog.push('A' + callbackAIterations);
157
callbackAIterations++;
158
});
159
const callbackB = jest.fn(() => callbackLog.push('B'));
160
161
- rIC(callbackA);
161
+ scheduleWork(callbackA);
162
// initially waits to call the callback
163
expect(callbackLog).toEqual([]);
164
- rIC(callbackB);
164
+ scheduleWork(callbackB);
165
expect(callbackLog).toEqual([]);
166
// after a delay, calls the latest callback passed
167
jest.runAllTimers();
@@ -170,29 +170,29 @@ describe('ReactScheduler', () => {
170
});
171
});
172
173
- describe('cIC', () => {
173
+ describe('cancelScheduledWork', () => {
174
it('cancels the scheduled callback', () => {
175
- const {rIC, cIC} = ReactScheduler;
175
+ const {scheduleWork, cancelScheduledWork} = ReactScheduler;
176
const cb = jest.fn();
177
- const callbackId = rIC(cb);
177
+ const callbackId = scheduleWork(cb);
178
expect(cb.mock.calls.length).toBe(0);
179
- cIC(callbackId);
179
+ cancelScheduledWork(callbackId);
180
jest.runAllTimers();
181
expect(cb.mock.calls.length).toBe(0);
182
});
183
184
describe('with multiple callbacks', () => {
185
it('when one callback cancels the next one', () => {
186
- const {rIC, cIC} = ReactScheduler;
186
+ const {scheduleWork, cancelScheduledWork} = ReactScheduler;
187
const callbackLog = [];
188
let callbackBId;
189
const callbackA = jest.fn(() => {
190
callbackLog.push('A');
191
- cIC(callbackBId);
191
+ cancelScheduledWork(callbackBId);
192
});
193
const callbackB = jest.fn(() => callbackLog.push('B'));
194
- rIC(callbackA);
195
- callbackBId = rIC(callbackB);
194
+ scheduleWork(callbackA);
195
+ callbackBId = scheduleWork(callbackB);
196
// Initially doesn't call anything
197
expect(callbackLog).toEqual([]);
198
jest.runAllTimers();