3

Today I wrote: a mousetrail program. lol

<html>
<head>
<title>mouse trail</title>
</head>
<body>

<script>
/* elements */
let elements = [];

for(let i=0; i<5; i++) {
let div = document.createElement("div");
div.style.position = "absolute";
div.style.left += (30*i) + "px";
div.style.width = "10px";
div.style.height = "10px";
div.style.backgroundColor = "blue";
elements[i] = div;
document.body.appendChild(div);
}

/* mousex, mousey */
document.body.addEventListener("mousemove", event => {
let mouseX = event.clientX;
let mouseY = event.clientY;

for(let i=0; i<elements.length; i++) {
/* timeout */
setTimeout(() => { elements[i].style.left = mouseX + (10*i)}, (50*i));
setTimeout(() => { elements[i].style.top = mouseY + (10*i)}, (50*i));
}
});

</script>
</body>
</html>

Comments
  • 2
    Nice, but be more js-y. elements.push does exist and elements.forEach.
  • 1
    @retoor Yes, I intentionally kept it super old school. lol. I wonder what the time complexity / linear complexity is of the Array.push() in js. In the book I read it mentioned that trees are a more performing data structure in that sense.
  • 2
    @CaptainRant Yeah, but there is a breakpoint, when you can outperform a linear iteration, but 5 is not it XD
  • 1
    @CaptainRant an array in JS is not an array, it's a list, and the implementation details are up to the runtime. I think the mutation operations (push, pop, shift, etc) are pretty complicated in the V8 runtime.

    JavaScript is a BAD language to study if you want to understand it. There's a boatload of "tricks" they need to employ to get a scripting language running as fast as JS does.

    V8 might be one of the most complicated programs in history, or so I've heard. Surely it's just hyperbole, but I fully trust that it is not a friendly codebase.
  • 0
    @AlgoRythm There is a whole slew of bugs because they don't call the destructors of objects (that are created through js or something similar) with the reason of "speed"
  • 0
    Very nice Work, looking quite attractive...!!!
  • 1
Add Comment