mirror of
https://github.com/facebook/react.git
synced 2025-11-01 09:12:30 +00:00
Generate SimpleEventPlugin data structures at runtime (#7616)
We used to copy and paste the same big blob many times in order for it to work with keyOf which is no longer a constraint. This pull request takes a list of all the events as string and generate those data structures at runtime.
It reduces the size of React by 1k post gzip and flow is able to extract the structure out of it :)
(cherry picked from commit 1229a238c4)
This commit is contained in:
committed by
Paul O’Shannessy
parent
bef7ae4800
commit
ae79e023d5
@@ -30,451 +30,104 @@ var emptyFunction = require('emptyFunction');
|
||||
var getEventCharCode = require('getEventCharCode');
|
||||
var invariant = require('invariant');
|
||||
|
||||
var eventTypes = {
|
||||
abort: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onAbort',
|
||||
captured: 'onAbortCapture',
|
||||
},
|
||||
},
|
||||
animationEnd: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onAnimationEnd',
|
||||
captured: 'onAnimationEndCapture',
|
||||
},
|
||||
},
|
||||
animationIteration: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onAnimationIteration',
|
||||
captured: 'onAnimationIterationCapture',
|
||||
},
|
||||
},
|
||||
animationStart: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onAnimationStart',
|
||||
captured: 'onAnimationStartCapture',
|
||||
},
|
||||
},
|
||||
blur: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onBlur',
|
||||
captured: 'onBlurCapture',
|
||||
},
|
||||
},
|
||||
canPlay: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onCanPlay',
|
||||
captured: 'onCanPlayCapture',
|
||||
},
|
||||
},
|
||||
canPlayThrough: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onCanPlayThrough',
|
||||
captured: 'onCanPlayThroughCapture',
|
||||
},
|
||||
},
|
||||
click: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onClick',
|
||||
captured: 'onClickCapture',
|
||||
},
|
||||
},
|
||||
contextMenu: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onContextMenu',
|
||||
captured: 'onContextMenuCapture',
|
||||
},
|
||||
},
|
||||
copy: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onCopy',
|
||||
captured: 'onCopyCapture',
|
||||
},
|
||||
},
|
||||
cut: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onCut',
|
||||
captured: 'onCutCapture',
|
||||
},
|
||||
},
|
||||
doubleClick: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onDoubleClick',
|
||||
captured: 'onDoubleClickCapture',
|
||||
},
|
||||
},
|
||||
drag: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onDrag',
|
||||
captured: 'onDragCapture',
|
||||
},
|
||||
},
|
||||
dragEnd: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onDragEnd',
|
||||
captured: 'onDragEndCapture',
|
||||
},
|
||||
},
|
||||
dragEnter: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onDragEnter',
|
||||
captured: 'onDragEnterCapture',
|
||||
},
|
||||
},
|
||||
dragExit: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onDragExit',
|
||||
captured: 'onDragExitCapture',
|
||||
},
|
||||
},
|
||||
dragLeave: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onDragLeave',
|
||||
captured: 'onDragLeaveCapture',
|
||||
},
|
||||
},
|
||||
dragOver: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onDragOver',
|
||||
captured: 'onDragOverCapture',
|
||||
},
|
||||
},
|
||||
dragStart: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onDragStart',
|
||||
captured: 'onDragStartCapture',
|
||||
},
|
||||
},
|
||||
drop: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onDrop',
|
||||
captured: 'onDropCapture',
|
||||
},
|
||||
},
|
||||
durationChange: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onDurationChange',
|
||||
captured: 'onDurationChangeCapture',
|
||||
},
|
||||
},
|
||||
emptied: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onEmptied',
|
||||
captured: 'onEmptiedCapture',
|
||||
},
|
||||
},
|
||||
encrypted: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onEncrypted',
|
||||
captured: 'onEncryptedCapture',
|
||||
},
|
||||
},
|
||||
ended: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onEnded',
|
||||
captured: 'onEndedCapture',
|
||||
},
|
||||
},
|
||||
error: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onError',
|
||||
captured: 'onErrorCapture',
|
||||
},
|
||||
},
|
||||
focus: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onFocus',
|
||||
captured: 'onFocusCapture',
|
||||
},
|
||||
},
|
||||
input: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onInput',
|
||||
captured: 'onInputCapture',
|
||||
},
|
||||
},
|
||||
invalid: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onInvalid',
|
||||
captured: 'onInvalidCapture',
|
||||
},
|
||||
},
|
||||
keyDown: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onKeyDown',
|
||||
captured: 'onKeyDownCapture',
|
||||
},
|
||||
},
|
||||
keyPress: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onKeyPress',
|
||||
captured: 'onKeyPressCapture',
|
||||
},
|
||||
},
|
||||
keyUp: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onKeyUp',
|
||||
captured: 'onKeyUpCapture',
|
||||
},
|
||||
},
|
||||
load: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onLoad',
|
||||
captured: 'onLoadCapture',
|
||||
},
|
||||
},
|
||||
loadedData: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onLoadedData',
|
||||
captured: 'onLoadedDataCapture',
|
||||
},
|
||||
},
|
||||
loadedMetadata: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onLoadedMetadata',
|
||||
captured: 'onLoadedMetadataCapture',
|
||||
},
|
||||
},
|
||||
loadStart: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onLoadStart',
|
||||
captured: 'onLoadStartCapture',
|
||||
},
|
||||
},
|
||||
// Note: We do not allow listening to mouseOver events. Instead, use the
|
||||
// onMouseEnter/onMouseLeave created by `EnterLeaveEventPlugin`.
|
||||
mouseDown: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onMouseDown',
|
||||
captured: 'onMouseDownCapture',
|
||||
},
|
||||
},
|
||||
mouseMove: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onMouseMove',
|
||||
captured: 'onMouseMoveCapture',
|
||||
},
|
||||
},
|
||||
mouseOut: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onMouseOut',
|
||||
captured: 'onMouseOutCapture',
|
||||
},
|
||||
},
|
||||
mouseOver: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onMouseOver',
|
||||
captured: 'onMouseOverCapture',
|
||||
},
|
||||
},
|
||||
mouseUp: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onMouseUp',
|
||||
captured: 'onMouseUpCapture',
|
||||
},
|
||||
},
|
||||
paste: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onPaste',
|
||||
captured: 'onPasteCapture',
|
||||
},
|
||||
},
|
||||
pause: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onPause',
|
||||
captured: 'onPauseCapture',
|
||||
},
|
||||
},
|
||||
play: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onPlay',
|
||||
captured: 'onPlayCapture',
|
||||
},
|
||||
},
|
||||
playing: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onPlaying',
|
||||
captured: 'onPlayingCapture',
|
||||
},
|
||||
},
|
||||
progress: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onProgress',
|
||||
captured: 'onProgressCapture',
|
||||
},
|
||||
},
|
||||
rateChange: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onRateChange',
|
||||
captured: 'onRateChangeCapture',
|
||||
},
|
||||
},
|
||||
reset: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onReset',
|
||||
captured: 'onResetCapture',
|
||||
},
|
||||
},
|
||||
scroll: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onScroll',
|
||||
captured: 'onScrollCapture',
|
||||
},
|
||||
},
|
||||
seeked: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onSeeked',
|
||||
captured: 'onSeekedCapture',
|
||||
},
|
||||
},
|
||||
seeking: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onSeeking',
|
||||
captured: 'onSeekingCapture',
|
||||
},
|
||||
},
|
||||
stalled: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onStalled',
|
||||
captured: 'onStalledCapture',
|
||||
},
|
||||
},
|
||||
submit: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onSubmit',
|
||||
captured: 'onSubmitCapture',
|
||||
},
|
||||
},
|
||||
suspend: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onSuspend',
|
||||
captured: 'onSuspendCapture',
|
||||
},
|
||||
},
|
||||
timeUpdate: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onTimeUpdate',
|
||||
captured: 'onTimeUpdateCapture',
|
||||
},
|
||||
},
|
||||
touchCancel: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onTouchCancel',
|
||||
captured: 'onTouchCancelCapture',
|
||||
},
|
||||
},
|
||||
touchEnd: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onTouchEnd',
|
||||
captured: 'onTouchEndCapture',
|
||||
},
|
||||
},
|
||||
touchMove: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onTouchMove',
|
||||
captured: 'onTouchMoveCapture',
|
||||
},
|
||||
},
|
||||
touchStart: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onTouchStart',
|
||||
captured: 'onTouchStartCapture',
|
||||
},
|
||||
},
|
||||
transitionEnd: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onTransitionEnd',
|
||||
captured: 'onTransitionEndCapture',
|
||||
},
|
||||
},
|
||||
volumeChange: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onVolumeChange',
|
||||
captured: 'onVolumeChangeCapture',
|
||||
},
|
||||
},
|
||||
waiting: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onWaiting',
|
||||
captured: 'onWaitingCapture',
|
||||
},
|
||||
},
|
||||
wheel: {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: 'onWheel',
|
||||
captured: 'onWheelCapture',
|
||||
},
|
||||
},
|
||||
};
|
||||
/**
|
||||
* Turns
|
||||
* ['abort', ...]
|
||||
* into
|
||||
* eventTypes = {
|
||||
* 'abort': {
|
||||
* phasedRegistrationNames: {
|
||||
* bubbled: 'onAbort',
|
||||
* captured: 'onAbortCapture',
|
||||
* },
|
||||
* dependencies: ['topAbort'],
|
||||
* },
|
||||
* ...
|
||||
* };
|
||||
* topLevelEventsToDispatchConfig = {
|
||||
* 'topAbort': { sameConfig }
|
||||
* };
|
||||
*/
|
||||
var eventTypes = {};
|
||||
var topLevelEventsToDispatchConfig = {};
|
||||
[
|
||||
'abort',
|
||||
'animationEnd',
|
||||
'animationIteration',
|
||||
'animationStart',
|
||||
'blur',
|
||||
'canPlay',
|
||||
'canPlayThrough',
|
||||
'click',
|
||||
'contextMenu',
|
||||
'copy',
|
||||
'cut',
|
||||
'doubleClick',
|
||||
'drag',
|
||||
'dragEnd',
|
||||
'dragEnter',
|
||||
'dragExit',
|
||||
'dragLeave',
|
||||
'dragOver',
|
||||
'dragStart',
|
||||
'drop',
|
||||
'durationChange',
|
||||
'emptied',
|
||||
'encrypted',
|
||||
'ended',
|
||||
'error',
|
||||
'focus',
|
||||
'input',
|
||||
'invalid',
|
||||
'keyDown',
|
||||
'keyPress',
|
||||
'keyUp',
|
||||
'load',
|
||||
'loadedData',
|
||||
'loadedMetadata',
|
||||
'loadStart',
|
||||
'mouseDown',
|
||||
'mouseMove',
|
||||
'mouseOut',
|
||||
'mouseOver',
|
||||
'mouseUp',
|
||||
'paste',
|
||||
'pause',
|
||||
'play',
|
||||
'playing',
|
||||
'progress',
|
||||
'rateChange',
|
||||
'reset',
|
||||
'scroll',
|
||||
'seeked',
|
||||
'seeking',
|
||||
'stalled',
|
||||
'submit',
|
||||
'suspend',
|
||||
'timeUpdate',
|
||||
'touchCancel',
|
||||
'touchEnd',
|
||||
'touchMove',
|
||||
'touchStart',
|
||||
'transitionEnd',
|
||||
'volumeChange',
|
||||
'waiting',
|
||||
'wheel',
|
||||
].forEach(event => {
|
||||
var capitalizedEvent = event[0].toUpperCase() + event.slice(1);
|
||||
var onEvent = 'on' + capitalizedEvent;
|
||||
var topEvent = 'top' + capitalizedEvent;
|
||||
|
||||
var topLevelEventsToDispatchConfig = {
|
||||
topAbort: eventTypes.abort,
|
||||
topAnimationEnd: eventTypes.animationEnd,
|
||||
topAnimationIteration: eventTypes.animationIteration,
|
||||
topAnimationStart: eventTypes.animationStart,
|
||||
topBlur: eventTypes.blur,
|
||||
topCanPlay: eventTypes.canPlay,
|
||||
topCanPlayThrough: eventTypes.canPlayThrough,
|
||||
topClick: eventTypes.click,
|
||||
topContextMenu: eventTypes.contextMenu,
|
||||
topCopy: eventTypes.copy,
|
||||
topCut: eventTypes.cut,
|
||||
topDoubleClick: eventTypes.doubleClick,
|
||||
topDrag: eventTypes.drag,
|
||||
topDragEnd: eventTypes.dragEnd,
|
||||
topDragEnter: eventTypes.dragEnter,
|
||||
topDragExit: eventTypes.dragExit,
|
||||
topDragLeave: eventTypes.dragLeave,
|
||||
topDragOver: eventTypes.dragOver,
|
||||
topDragStart: eventTypes.dragStart,
|
||||
topDrop: eventTypes.drop,
|
||||
topDurationChange: eventTypes.durationChange,
|
||||
topEmptied: eventTypes.emptied,
|
||||
topEncrypted: eventTypes.encrypted,
|
||||
topEnded: eventTypes.ended,
|
||||
topError: eventTypes.error,
|
||||
topFocus: eventTypes.focus,
|
||||
topInput: eventTypes.input,
|
||||
topInvalid: eventTypes.invalid,
|
||||
topKeyDown: eventTypes.keyDown,
|
||||
topKeyPress: eventTypes.keyPress,
|
||||
topKeyUp: eventTypes.keyUp,
|
||||
topLoad: eventTypes.load,
|
||||
topLoadedData: eventTypes.loadedData,
|
||||
topLoadedMetadata: eventTypes.loadedMetadata,
|
||||
topLoadStart: eventTypes.loadStart,
|
||||
topMouseDown: eventTypes.mouseDown,
|
||||
topMouseMove: eventTypes.mouseMove,
|
||||
topMouseOut: eventTypes.mouseOut,
|
||||
topMouseOver: eventTypes.mouseOver,
|
||||
topMouseUp: eventTypes.mouseUp,
|
||||
topPaste: eventTypes.paste,
|
||||
topPause: eventTypes.pause,
|
||||
topPlay: eventTypes.play,
|
||||
topPlaying: eventTypes.playing,
|
||||
topProgress: eventTypes.progress,
|
||||
topRateChange: eventTypes.rateChange,
|
||||
topReset: eventTypes.reset,
|
||||
topScroll: eventTypes.scroll,
|
||||
topSeeked: eventTypes.seeked,
|
||||
topSeeking: eventTypes.seeking,
|
||||
topStalled: eventTypes.stalled,
|
||||
topSubmit: eventTypes.submit,
|
||||
topSuspend: eventTypes.suspend,
|
||||
topTimeUpdate: eventTypes.timeUpdate,
|
||||
topTouchCancel: eventTypes.touchCancel,
|
||||
topTouchEnd: eventTypes.touchEnd,
|
||||
topTouchMove: eventTypes.touchMove,
|
||||
topTouchStart: eventTypes.touchStart,
|
||||
topTransitionEnd: eventTypes.transitionEnd,
|
||||
topVolumeChange: eventTypes.volumeChange,
|
||||
topWaiting: eventTypes.waiting,
|
||||
topWheel: eventTypes.wheel,
|
||||
};
|
||||
|
||||
for (var type in topLevelEventsToDispatchConfig) {
|
||||
topLevelEventsToDispatchConfig[type].dependencies = [type];
|
||||
}
|
||||
var type = {
|
||||
phasedRegistrationNames: {
|
||||
bubbled: onEvent,
|
||||
captured: onEvent + 'Capture',
|
||||
},
|
||||
dependencies: [topEvent],
|
||||
};
|
||||
eventTypes[event] = type;
|
||||
topLevelEventsToDispatchConfig[topEvent] = type;
|
||||
});
|
||||
|
||||
var onClickListeners = {};
|
||||
|
||||
|
||||
Reference in New Issue
Block a user