The library for web and native user interfaces.
Cleanup `style` Prop Reconciliation
This cleans up the reconcilation path when adding a `style` prop (going from a falsey or no `style` to having one) by reducing the need for an object allocation and for-loop.
CommitSyncScript committed
Jun 13, 2013 at 16:33 UTC
802241a66016b23024f530affec3bc8ccda16402
1 file changed
+18
-20
src/core/ReactNativeComponent.js
+18
-20
@@ -220,13 +220,10 @@ ReactNativeComponent.Mixin = {
220
}
221
if (propKey === STYLE) {
222
for (styleName in lastProp) {
223
- if (!lastProp.hasOwnProperty(styleName)) {
224
- continue;
225
- }
226
- if (!styleUpdates) {
227
- styleUpdates = {};
223
+ if (lastProp.hasOwnProperty(styleName)) {
224
+ styleUpdates = styleUpdates || {};
225
+ styleUpdates[styleName] = '';
226
}
229
- styleUpdates[styleName] = '';
227
}
228
} else if (propKey === DANGEROUSLY_SET_INNER_HTML ||
229
propKey === CONTENT) {
@@ -253,24 +250,25 @@ ReactNativeComponent.Mixin = {
250
if (nextProp) {
251
nextProp = nextProps.style = merge(nextProp);
252
}
256
- for (styleName in lastProp) {
257
- if (lastProp.hasOwnProperty(styleName) && !nextProp[styleName]) {
258
- if (!styleUpdates) {
259
- styleUpdates = {};
253
+ if (lastProp) {
254
+ // Unset styles on `lastProp` but not on `nextProp`.
255
+ for (styleName in lastProp) {
256
+ if (lastProp.hasOwnProperty(styleName) && !nextProp[styleName]) {
257
+ styleUpdates = styleUpdates || {};
258
+ styleUpdates[styleName] = '';
259
}
261
- styleUpdates[styleName] = '';
262
- }
263
- }
264
- for (styleName in nextProp) {
265
- if (!nextProp.hasOwnProperty(styleName)) {
266
- continue;
260
}
268
- if (!lastProp || lastProp[styleName] !== nextProp[styleName]) {
269
- if (!styleUpdates) {
270
- styleUpdates = {};
261
+ // Update styles that changed since `lastProp`.
262
+ for (styleName in nextProp) {
263
+ if (nextProp.hasOwnProperty(styleName) &&
264
+ lastProp[styleName] !== nextProp[styleName]) {
265
+ styleUpdates = styleUpdates || {};
266
+ styleUpdates[styleName] = nextProp[styleName];
267
}
272
- styleUpdates[styleName] = nextProp[styleName];
268
}
269
+ } else {
270
+ // Relies on `updateStylesByID` not mutating `styleUpdates`.
271
+ styleUpdates = nextProp;
272
}
273
} else if (propKey === DANGEROUSLY_SET_INNER_HTML) {
274
var lastHtml = lastProp && lastProp.__html;