@samitouri / QOS-React / commits / ff724d3c28

[scheduler] 4/n Allow splitting out `schedule` in fb-www, prepare to fix polyfill issue internally (#12900)

* Use local references to global things inside 'scheduler' **what is the change?:** See title **why make this change?:** We want to avoid initially calling one version of an API and then later accessing a polyfilled version. **test plan:** Run existing tests. * Shim ReactScheduler for www **what is the change?:** In 'www' we want to reference the separate build of ReactScheduler, which allows treating it as a separate module internally. **why make this change?:** We need to require the ReactScheduler before our rAF polyfill activates, in order to customize which custom behaviors we want. This is also a step towards being able to experiment with using it outside of React. **test plan:** Ran tests, ran the build, and ran `test-build`. * Generate a bundle for fb-www **what is the change?:** See title **why make this change?:** Splitting out the 'schedule' module allows us to load it before polyfills kick in for rAF and other APIs. And long term we want to split this into a separate module anyway, this is a step towards that. **test plan:** I'll run the sync next week and verify that this all works. :) * ran prettier * fix rebase issues * Change names of variables used for holding globals

Flarnie Marchan committed May 29, 2018 at 13:30 UTC ff724d3c286a1753723ea71e8c046498ed1aac98

8 files changed +64 -5

packages/react-art/src/ReactARTHostConfig.js

+1 -1

@@ -5,7 +5,7 @@

5 * LICENSE file in the root directory of this source tree.

6 */

8 -import * as ReactScheduler from 'react-scheduler';

8 +import * as ReactScheduler from 'shared/ReactScheduler';

9 import Transform from 'art/core/transform';

10 import Mode from 'art/modes/current';

11 import invariant from 'fbjs/lib/invariant';

packages/react-dom/src/client/ReactDOMHostConfig.js

+1 -1

@@ -7,7 +7,7 @@

7 * @flow

8 */

10 -import * as ReactScheduler from 'react-scheduler';

10 +import * as ReactScheduler from 'shared/ReactScheduler';

12 import * as ReactDOMComponentTree from './ReactDOMComponentTree';

13 import * as ReactDOMFiberComponent from './ReactDOMFiberComponent';

packages/react-scheduler/src/ReactScheduler.js

+10 -2

@@ -44,13 +44,21 @@ export type CallbackIdType = CallbackConfigType;

44 import requestAnimationFrameForReact from 'shared/requestAnimationFrameForReact';

45 import ExecutionEnvironment from 'fbjs/lib/ExecutionEnvironment';

47 +// We capture a local reference to any global, in case it gets polyfilled after

48 +// this module is initially evaluated.

49 +// We want to be using a consistent implementation.

50 +const Date = global.Date;

51 +const setTimeout = global.setTimeout;

52 +const clearTimeout = global.clearTimeout;

53 +

54 const hasNativePerformanceNow =

55 typeof performance === 'object' && typeof performance.now === 'function';

57 let now;

58 if (hasNativePerformanceNow) {

59 + const Performance = performance;

60 now = function() {

53 - return performance.now();

61 + return Performance.now();

62 };

63 } else {

64 now = function() {

@@ -224,7 +232,7 @@ if (!ExecutionEnvironment.canUseDOM) {

232 };

233 // Assumes that we have addEventListener in this environment. Might need

234 // something better for old IE.

227 - window.addEventListener('message', idleTick, false);

235 + global.addEventListener('message', idleTick, false);

236

237 const animationTick = function(rafTime) {

238 isAnimationFrameScheduled = false;

packages/shared/ReactScheduler.js new

+17

@@ -0,0 +1,17 @@

1 +/**

3 + *

4 + * This source code is licensed under the MIT license found in the

5 + * LICENSE file in the root directory of this source tree.

6 + *

7 + * @flow

8 + */

9 +

10 +'use strict';

11 +import {

12 + now,

13 + scheduleWork,

14 + cancelScheduledWork,

15 +} from 'react-scheduler/src/ReactScheduler';

16 +

17 +export {now, scheduleWork, cancelScheduledWork};

packages/shared/forks/ReactScheduler.www.js new

+11

@@ -0,0 +1,11 @@

1 +/**

3 + *

4 + * This source code is licensed under the MIT license found in the

5 + * LICENSE file in the root directory of this source tree.

6 + */

7 +

8 +'use strict';

9 +const {now, scheduleWork, cancelScheduledWork} = require('customSchedule');

10 +

11 +export {now, scheduleWork, cancelScheduledWork};

packages/shared/requestAnimationFrameForReact.js

@@ -12,6 +12,11 @@

12 import ExecutionEnvironment from 'fbjs/lib/ExecutionEnvironment';

13 import warning from 'fbjs/lib/warning';

15 +// We capture a local reference to any global, in case it gets polyfilled after

16 +// this module is initially evaluated.

17 +// We want to be using a consistent implementation.

18 +const requestAnimationFrame = global.requestAnimationFrame;

19 +

20 if (__DEV__) {

21 if (

22 ExecutionEnvironment.canUseDOM &&

scripts/rollup/bundles.js

+8 -1

@@ -371,7 +371,14 @@ const bundles = [

371 /******* React Scheduler (experimental) *******/

372 {

373 label: 'react-scheduler',

374 - bundleTypes: [NODE_DEV, NODE_PROD, UMD_DEV, UMD_PROD],

374 + bundleTypes: [

375 + UMD_DEV,

376 + UMD_PROD,

377 + NODE_DEV,

378 + NODE_PROD,

379 + FB_WWW_DEV,

380 + FB_WWW_PROD,

381 + ],

382 moduleType: ISOMORPHIC,

383 entry: 'react-scheduler',

384 global: 'ReactScheduler',

scripts/rollup/forks.js

+11

@@ -79,6 +79,7 @@ const forks = Object.freeze({

79 },

81 // This logic is forked on www to use the 'acrossTransitions' version.

82 + // This will be removed soon, see internal task T29442940

83 'shared/requestAnimationFrameForReact': (bundleType, entry) => {

84 switch (bundleType) {

85 case FB_WWW_DEV:

@@ -89,6 +90,16 @@ const forks = Object.freeze({

90 }

91 },

93 + 'shared/ReactScheduler': (bundleType, entry) => {

94 + switch (bundleType) {

95 + case FB_WWW_DEV:

96 + case FB_WWW_PROD:

97 + return 'shared/forks/ReactScheduler.www.js';

98 + default:

99 + return null;

100 + }

101 + },

102 +

103 // This logic is forked on www to blacklist warnings.

104 'shared/lowPriorityWarning': (bundleType, entry) => {

105 switch (bundleType) {