From d08ce5d937bcc0c8257f32d1620ca6633bbbd254 Mon Sep 17 00:00:00 2001
From: Paul Kaplan <pkaplan@media.mit.edu>
Date: Mon, 28 Jan 2019 12:02:03 -0500
Subject: [PATCH] Move rounding into sprite info to avoid generating lots of
garbage
It also avoids repeating the costly object spread, which becomes a problem for projects with a lot of sprites
---
src/components/sprite-info/sprite-info.jsx | 17 ++++++-------
src/containers/target-pane.jsx | 28 ++++++++++------------
2 files changed, 21 insertions(+), 24 deletions(-)
diff --git a/src/components/sprite-info/sprite-info.jsx b/src/components/sprite-info/sprite-info.jsx
index e9090bfe3..09c94d016 100644
--- a/src/components/sprite-info/sprite-info.jsx
+++ b/src/components/sprite-info/sprite-info.jsx
@@ -34,14 +34,15 @@ class SpriteInfo extends React.Component {
shouldComponentUpdate (nextProps) {
return (
this.props.rotationStyle !== nextProps.rotationStyle ||
- this.props.direction !== nextProps.direction ||
this.props.disabled !== nextProps.disabled ||
this.props.name !== nextProps.name ||
- this.props.size !== nextProps.size ||
this.props.stageSize !== nextProps.stageSize ||
this.props.visible !== nextProps.visible ||
- this.props.x !== nextProps.x ||
- this.props.y !== nextProps.y
+ // Only update these if rounded value has changed
+ Math.round(this.props.direction) !== Math.round(nextProps.direction) ||
+ Math.round(this.props.size) !== Math.round(nextProps.size) ||
+ Math.round(this.props.x) !== Math.round(nextProps.x) ||
+ Math.round(this.props.y) !== Math.round(nextProps.y)
);
}
render () {
@@ -110,7 +111,7 @@ class SpriteInfo extends React.Component {
placeholder="x"
tabIndex="0"
type="text"
- value={this.props.disabled ? '' : this.props.x}
+ value={this.props.disabled ? '' : Math.round(this.props.x)}
onSubmit={this.props.onChangeX}
/>
</Label>
@@ -137,7 +138,7 @@ class SpriteInfo extends React.Component {
placeholder="y"
tabIndex="0"
type="text"
- value={this.props.disabled ? '' : this.props.y}
+ value={this.props.disabled ? '' : Math.round(this.props.y)}
onSubmit={this.props.onChangeY}
/>
</Label>
@@ -237,14 +238,14 @@ class SpriteInfo extends React.Component {
label={sizeLabel}
tabIndex="0"
type="text"
- value={this.props.disabled ? '' : this.props.size}
+ value={this.props.disabled ? '' : Math.round(this.props.size)}
onSubmit={this.props.onChangeSize}
/>
</Label>
</div>
<div className={classNames(styles.group, styles.largerInput)}>
<DirectionPicker
- direction={this.props.direction}
+ direction={Math.round(this.props.direction)}
disabled={this.props.disabled}
labelAbove={labelAbove}
rotationStyle={this.props.rotationStyle}
diff --git a/src/containers/target-pane.jsx b/src/containers/target-pane.jsx
index eb4100969..cfa5af87d 100644
--- a/src/containers/target-pane.jsx
+++ b/src/containers/target-pane.jsx
@@ -248,22 +248,18 @@ TargetPane.propTypes = {
...targetPaneProps
};
-const mapStateToProps = state => ({
- editingTarget: state.scratchGui.targets.editingTarget,
- hoveredTarget: state.scratchGui.hoveredTarget,
- sprites: Object.keys(state.scratchGui.targets.sprites).reduce((sprites, k) => {
- let {direction, size, x, y, ...sprite} = state.scratchGui.targets.sprites[k];
- if (typeof direction !== 'undefined') direction = Math.round(direction);
- if (typeof x !== 'undefined') x = Math.round(x);
- if (typeof y !== 'undefined') y = Math.round(y);
- if (typeof size !== 'undefined') size = Math.round(size);
- sprites[k] = {...sprite, direction, size, x, y};
- return sprites;
- }, {}),
- stage: state.scratchGui.targets.stage,
- raiseSprites: state.scratchGui.blockDrag,
- spriteLibraryVisible: state.scratchGui.modals.spriteLibrary
-});
+const mapStateToProps = state => {
+ const props = {
+ editingTarget: state.scratchGui.targets.editingTarget,
+ hoveredTarget: state.scratchGui.hoveredTarget,
+ sprites: state.scratchGui.targets.sprites,
+ stage: state.scratchGui.targets.stage,
+ raiseSprites: state.scratchGui.blockDrag,
+ spriteLibraryVisible: state.scratchGui.modals.spriteLibrary
+ };
+ return props;
+};
+
const mapDispatchToProps = dispatch => ({
onNewSpriteClick: e => {
e.preventDefault();
--
GitLab