domvm discussion: Don't re-render view if stream wasn't changed

See: https://github.com/leeoniya/domvm/issues/171

by jlgrall

HTML

<script src="https://rawgit.com/leeoniya/domvm/3.0.6/dist/dev/domvm.dev.js"></script>
<div>See your console log...</div>
<!-- This HTML tab only contains the Flyd source code -->
<script>
// Flyd (24 Jan 2017) (https://github.com/paldepind/flyd)
(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.flyd=f()}})(function(){var define,module,exports;return function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s}({1:[function(require,module,exports){"use strict";var curryN=require("ramda/src/curryN");function isFunction(obj){return!!(obj&&obj.constructor&&obj.call&&obj.apply)}function trueFn(){return true}var toUpdate=[];var inStream;var order=[];var orderNextIdx=-1;var flushing=false;var flyd={};flyd.stream=function(initialValue){var endStream=createDependentStream([],trueFn);var s=createStream();s.end=endStream;s.fnArgs=[];endStream.listeners.push(s);s.toJSON=function(){return s()};if(arguments.length>0)s(initialValue);return s};flyd.combine=curryN(2,combine);function combine(fn,streams){var i,s,deps,depEndStreams;var...

JavaScript

var el = domvm.defineElement
		vw = domvm.defineView;
domvm.config({
	stream: {
		is:		s => flyd.isStream(s),
		val:	s => s(),
		sub:	(s, fn) => flyd.on(fn, s),
		unsub:	s => s.end(true),
	}
});

// Parent and child streams are unrelated:
window.parentStr = flyd.stream("Parent: 100");
window.childStr = flyd.stream("Child: 0");;

var Parent = {
	render: function() {
  	console.log("Render Parent");
  	return el("#container", [
    	el("div", parentStr),
      vw(Child)
    ]);
  }
};
var Child = {
	render: function() {
  	console.log("Render Child");
  	return el("div", childStr);
  }
};

window.vm = domvm.createView(Parent).mount(document.body);


console.log("Now we change the content of the parent stream, and we would like that only the parent re-renders, not the child (but the child will re-render anyway):")
parentStr("Parent: 200");