Styles from attributes to node

[lifeart]

After app render, will be good idea to move binded styles to style node

var styleNode = null;

function createStyleNode() {
	var head = document.head || document.getElementsByTagName('head')[0];
	var style = document.createElement('style');
	style.type = 'text/css';
	head.appendChild(style);
	return style;
}

function addStyle(css) {
	if (!styleNode) {
		styleNode = createStyleNode();
	}
	
	if (styleNode.styleSheet){
		styleNode.styleSheet.cssText = css;
	} else {
		styleNode.innerHTML = '';
		styleNode.appendChild(document.createTextNode(css));
	}
}

var styles = Array.prototype.map.call(document.getElementsByTagName('div'), function(node, index) {
	node.dataset.index = index;
	var style = node.getAttribute('style');
	node.removeAttribute('style');
	var prefix = '';
	if (node.className) {
		prefix = '.'+node.className.split(' ').join('.');
	}
	return `${prefix}[data-index="${index}"]{${style};}`;
});

addStyle(styles.join(''));

[whoozle]

this needs additional performance investigation, since we already do updates in batches and it will most likely trigger additional layouts