Reduce size by golfing down some pieces 🏌️‍♂️ (-39 B) (preactjs#1578)

Reduce size by golfing down some pieces 🏌️‍♂️ (-39 B)

hooks/test/browser/useContext.test.js

@@ -40,12 +40,12 @@ describe('useContext', () => {
 		const Foo = createContext(42);
 		const spy = sinon.spy();
 
- 		function App() {
+		function App() {
 			spy(useContext(Foo));
 			return <div />;
 		}
 
- 		render(<App />, scratch);
+		render(<App />, scratch);
 		expect(spy).to.be.calledWith(42);
 	});
 
@@ -62,7 +62,7 @@ describe('useContext', () => {
 			}
 		}
 
- 		function App(props) {
+		function App(props) {
 			return (
 				<Ctx.Provider value={props.value}>
 					<NoUpdate>
@@ -72,18 +72,18 @@ describe('useContext', () => {
 			);
 		}
 
- 		function Comp() {
+		function Comp() {
 			const value = useContext(Ctx);
 			spy(value);
 			return <h1>{value}</h1>;
 		}
 
- 		render(<App value={0} />, scratch);
+		render(<App value={0} />, scratch);
 		expect(spy).to.be.calledOnce;
 		expect(spy).to.be.calledWith(0);
 		render(<App value={1} />, scratch);
 
- 		// Wait for enqueued hook update
+		// Wait for enqueued hook update
 		setTimeout(() => {
 			// Should not be called a third time
 			expect(spy).to.be.calledTwice;
@@ -96,67 +96,63 @@ describe('useContext', () => {
 		const spy = sinon.spy();
 		const Ctx = createContext(0);
 
- 		function App(props) {
+		function App(props) {
 			return (
 				<Ctx.Provider value={props.value}>
 					<Comp />
 				</Ctx.Provider>
 			);
 		}
 
- 		function Comp() {
+		function Comp() {
 			const value = useContext(Ctx);
 			spy(value);
 			return <h1>{value}</h1>;
 		}
 
- 		render(<App value={0} />, scratch);
+		render(<App value={0} />, scratch);
 		expect(spy).to.be.calledOnce;
 		expect(spy).to.be.calledWith(0);
 		render(<App value={1} />, scratch);
 
- 		expect(spy).to.be.calledTwice;
+		expect(spy).to.be.calledTwice;
 		expect(spy).to.be.calledWith(1);
 
- 		// Wait for enqueued hook update
+		// Wait for enqueued hook update
 		setTimeout(() => {
 			// Should not be called a third time
 			expect(spy).to.be.calledTwice;
 			done();
 		}, 0);
 	});
 
- 	it('should allow multiple context hooks at the same time', () => {
+	it('should allow multiple context hooks at the same time', () => {
 		const Foo = createContext(0);
 		const Bar = createContext(10);
 		const spy = sinon.spy();
 		const unmountspy = sinon.spy();
 
- 		function Comp() {
+		function Comp() {
 			const foo = useContext(Foo);
 			const bar = useContext(Bar);
 			spy(foo, bar);
-			useEffect(() => {
-				() => {
-					unmountspy();
-				}
-			})
+			useEffect(() =>	() => unmountspy());
 
- 			return <div />;
+			return <div />;
 		}
 
- 		render((
+		render((
 			<Foo.Provider value={0}>
 				<Bar.Provider value={10}>
 					<Comp />
 				</Bar.Provider>
 			</Foo.Provider>
 		), scratch);
 
- 		expect(spy).to.be.calledOnce;
+		expect(spy).to.be.calledOnce;
 		expect(spy).to.be.calledWith(0, 10);
 
- 		render((
+		render((
 			<Foo.Provider value={11}>
 				<Bar.Provider value={42}>
 					<Comp />

src/component.js

@@ -71,7 +71,7 @@ Component.prototype.forceUpdate = function(callback) {
 		const force = callback!==false;
 
 		let mounts = [];
-		dom = diff(dom, parentDom, vnode, vnode, this._context, parentDom.ownerSVGElement!==undefined, null, mounts, this._ancestorComponent, force, dom);
+		dom = diff(parentDom, vnode, vnode, this._context, parentDom.ownerSVGElement!==undefined, null, mounts, this._ancestorComponent, force, dom);
 		if (dom!=null && dom.parentNode!==parentDom) {
 			parentDom.appendChild(dom);
 		}

src/create-context.js

@@ -7,10 +7,8 @@ export let i = 0;
  * @param {any} defaultValue
  */
 export function createContext(defaultValue) {
-	const id = '__cC' + i++;
-
 	let context = {
-		_id: id,
+		_id: '__cC' + i++,
 		_defaultValue: defaultValue
 	};
 
@@ -20,12 +18,12 @@ export function createContext(defaultValue) {
 	Consumer.contextType = context;
 	context.Consumer = Consumer;
 
-	let ctx = { [id]: null };
+	let ctx = {};
 
 	function initProvider(comp) {
 		const subs = [];
 		comp.getChildContext = () => {
-			ctx[id] = comp;
+			ctx[context._id] = comp;
 			return ctx;
 		};
 		comp.shouldComponentUpdate = props => {

src/diff/children.js

@@ -24,8 +24,7 @@ import { removeNode } from '../util';
  * Fragments that have siblings. In most cases, it starts out as `oldChildren[0]._dom`.
  */
 export function diffChildren(parentDom, newParentVNode, oldParentVNode, context, isSvg, excessDomChildren, mounts, ancestorComponent, oldDom) {
-	let childVNode, i, j, oldVNode, newDom,
-		nextDom, sibDom;
+	let childVNode, i, j, oldVNode, newDom, sibDom;
 
 	let newChildren = newParentVNode._children || toChildArray(newParentVNode.props.children, newParentVNode._children=[], coerceToVNode, true);
 	// This is a compression of oldParentVNode!=null && oldParentVNode != EMPTY_OBJ && oldParentVNode._children || EMPTY_ARR
@@ -83,10 +82,8 @@ export function diffChildren(parentDom, newParentVNode, oldParentVNode, context,
 				}
 			}
 
-			nextDom = oldDom!=null && oldDom.nextSibling;
-
 			// Morph the old element into the new one, but don't append it to the dom yet
-			newDom = diff(oldVNode && oldVNode._dom, parentDom, childVNode, oldVNode, context, isSvg, excessDomChildren, mounts, ancestorComponent, null, oldDom);
+			newDom = diff(parentDom, childVNode, oldVNode, context, isSvg, excessDomChildren, mounts, ancestorComponent, null, oldDom);
 
 			// Only proceed if the vnode has not been unmounted by `diff()` above.
 			if (newDom!=null) {
@@ -116,7 +113,7 @@ export function diffChildren(parentDom, newParentVNode, oldParentVNode, context,
 					}
 				}
 
-				oldDom = newDom!=null ? newDom.nextSibling : nextDom;
+				oldDom = newDom.nextSibling;
 			}
 		}
 	}

src/diff/index.js

@@ -8,8 +8,6 @@ import options from '../options';
 
 /**
  * Diff two virtual nodes and apply proper changes to the DOM
- * @param {import('../internal').PreactElement | Text} dom The DOM element representing
- * the virtual nodes under diff
  * @param {import('../internal').PreactElement} parentDom The parent of the DOM element
  * @param {import('../internal').VNode | null} newVNode The new virtual node
  * @param {import('../internal').VNode | null} oldVNode The old virtual node
@@ -25,12 +23,11 @@ import options from '../options';
  * render (except when hydrating). Can be a sibling DOM element when diffing
  * Fragments that have siblings. In most cases, it starts out as `oldChildren[0]._dom`.
  */
-export function diff(dom, parentDom, newVNode, oldVNode, context, isSvg, excessDomChildren, mounts, ancestorComponent, force, oldDom) {
+export function diff(parentDom, newVNode, oldVNode, context, isSvg, excessDomChildren, mounts, ancestorComponent, force, oldDom) {
 	// If the previous type doesn't match the new type we drop the whole subtree
 	if (oldVNode==null || newVNode==null || oldVNode.type!==newVNode.type || oldVNode.key!==newVNode.key) {
 		if (oldVNode!=null) unmount(oldVNode, ancestorComponent);
 		if (newVNode==null) return null;
-		dom = null;
 		oldVNode = EMPTY_OBJ;
 	}
 
@@ -50,10 +47,9 @@ export function diff(dom, parentDom, newVNode, oldVNode, context, isSvg, excessD
 
 			// Mark dom as empty in case `_children` is any empty array. If it isn't
 			// we'll set `dom` to the correct value just a few lines later.
-			dom = null;
 
 			if (newVNode._children.length && newVNode._children[0]!=null) {
-				dom = newVNode._children[0]._dom;
+				newVNode._dom = newVNode._children[0]._dom;
 
 				// If the last child is a Fragment, use _lastDomChild, else use _dom
 				p = newVNode._children[newVNode._children.length - 1];
@@ -72,7 +68,7 @@ export function diff(dom, parentDom, newVNode, oldVNode, context, isSvg, excessD
 			if (oldVNode._component) {
 				c = newVNode._component = oldVNode._component;
 				clearProcessingException = c._processingException = c._pendingError;
-				dom = newVNode._dom = oldVNode._dom;
+				newVNode._dom = oldVNode._dom;
 			}
 			else {
 				// Instantiate the new component
@@ -116,7 +112,6 @@ export function diff(dom, parentDom, newVNode, oldVNode, context, isSvg, excessD
 				}
 
 				if (!force && c.shouldComponentUpdate!=null && c.shouldComponentUpdate(newVNode.props, c._nextState, cctx)===false) {
-					dom = newVNode._dom;
 					c.props = newVNode.props;
 					c.state = c._nextState;
 					c._dirty = false;
@@ -151,7 +146,7 @@ export function diff(dom, parentDom, newVNode, oldVNode, context, isSvg, excessD
 			}
 
 			c._depth = ancestorComponent ? (ancestorComponent._depth || 0) + 1 : 0;
-			c.base = dom = diff(dom, parentDom, vnode, prev, context, isSvg, excessDomChildren, mounts, c, null, oldDom);
+			c.base = newVNode._dom = diff(parentDom, vnode, prev, context, isSvg, excessDomChildren, mounts, c, null, oldDom);
 
 			if (vnode!=null) {
 				// If this component returns a Fragment (or another component that
@@ -163,18 +158,7 @@ export function diff(dom, parentDom, newVNode, oldVNode, context, isSvg, excessD
 			c._parentDom = parentDom;
 
 			if (newVNode.ref) applyRef(newVNode.ref, c, ancestorComponent);
-		}
-		else {
-			dom = diffElementNodes(dom, newVNode, oldVNode, context, isSvg, excessDomChildren, mounts, ancestorComponent);
-
-			if (newVNode.ref && (oldVNode.ref !== newVNode.ref)) {
-				applyRef(newVNode.ref, dom, ancestorComponent);
-			}
-		}
-
-		newVNode._dom = dom;
 
-		if (c!=null) {
 			while (p=c._renderCallbacks.pop()) p.call(c);
 
 			// Don't call componentDidUpdate on mount or when we bailed out via
@@ -183,6 +167,13 @@ export function diff(dom, parentDom, newVNode, oldVNode, context, isSvg, excessD
 				c.componentDidUpdate(oldProps, oldState, snapshot);
 			}
 		}
+		else {
+			newVNode._dom = diffElementNodes(oldVNode._dom, newVNode, oldVNode, context, isSvg, excessDomChildren, mounts, ancestorComponent);
+
+			if (newVNode.ref && (oldVNode.ref !== newVNode.ref)) {
+				applyRef(newVNode.ref, newVNode._dom, ancestorComponent);
+			}
+		}
 
 		if (clearProcessingException) {
 			c._pendingError = c._processingException = null;
@@ -194,7 +185,7 @@ export function diff(dom, parentDom, newVNode, oldVNode, context, isSvg, excessD
 		catchErrorInComponent(e, ancestorComponent);
 	}
 
-	return dom;
+	return newVNode._dom;
 }
 
 export function commitRoot(mounts, root) {
@@ -227,7 +218,7 @@ export function commitRoot(mounts, root) {
  * @returns {import('../internal').PreactElement}
  */
 function diffElementNodes(dom, newVNode, oldVNode, context, isSvg, excessDomChildren, mounts, ancestorComponent) {
-	let d = dom;
+	let originalDom = dom;
 
 	// Tracks entering and exiting SVG namespace when descending through the tree.
 	isSvg = newVNode.type==='svg' || isSvg;
@@ -249,10 +240,9 @@ function diffElementNodes(dom, newVNode, oldVNode, context, isSvg, excessDomChil
 		// we created a new parent, so none of the previously attached children can be reused:
 		excessDomChildren = null;
 	}
-	newVNode._dom = dom;
 
 	if (newVNode.type===null) {
-		if ((d===null || dom===d) && newVNode.text!==oldVNode.text) {
+		if ((originalDom==null || dom===originalDom) && newVNode.text!==oldVNode.text) {
 			dom.data = newVNode.text;
 		}
 	}