This tests the performance impact of "automount"ing automatically.
Last active
January 8, 2018 21:14
-
-
Save phillipskevin/5e1cd05b92960c0aa09e485d55ca8f1c to your computer and use it in GitHub Desktop.
auto-automount test
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html> | |
<script src="./node_modules/steal/steal.js"></script> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import stache from "can-stache"; | |
import viewCallbacks from "can-view-callbacks"; | |
import canSymbol from "can-symbol"; | |
const viewModelSymbol = canSymbol.for("can.viewModel"); | |
var obs = new MutationObserver(function MUTATION_HANDLER(mutationsList) { | |
for(let mutation of mutationsList) { | |
if (mutation.type === "childList") { | |
for (let addedNode of mutation.addedNodes) { | |
if (!addedNode[viewModelSymbol] && viewCallbacks._tags[addedNode.tagName.toLowerCase()]) { | |
// element should be mounted | |
} | |
} | |
} | |
} | |
}); | |
obs.observe(document.documentElement, { childList: true, subtree: true }); | |
function renderDivs(num) { | |
let viewStr = ""; | |
for (let i=0; i<num; i++) { | |
viewStr += `<div>div ${i}</div>`; | |
} | |
const view = stache(viewStr); | |
document.body.appendChild( | |
view() | |
); | |
console.log(`rendered ${num} divs`); | |
} | |
const button = document.createElement("button"); | |
button.innerHTML = "run test"; | |
button.addEventListener("click", function() { | |
renderDivs(500); | |
}); | |
document.body.appendChild(button); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"name": "auto-automount-test", | |
"version": "1.0.0", | |
"description": "", | |
"main": "index.js", | |
"scripts": { | |
"test": "echo \"Error: no test specified\" && exit 1" | |
}, | |
"keywords": [], | |
"author": "", | |
"license": "ISC", | |
"dependencies": { | |
"can-stache": "^4.0.0-pre.50", | |
"can-symbol": "^1.0.0-pre.4", | |
"can-view-callbacks": "^4.0.0-pre.10", | |
"steal": "^1.6.2" | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment