Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
JavaScript driven:
<div class="raf"></div>
CSS driven:
<div class="animated"></div>
<label>
  <input type="checkbox">Add main thread jank
</label>
const square = document.querySelector('.raf');
const jank = document.querySelector('input');
let last = 0;
requestAnimationFrame(function f(ts) {
  if(jank.checked) {
    // noprotect
    for(var i = 0; i<1e8; i++);
  }
  requestAnimationFrame(f);
  if (last === 0)
    return (last = ts);
  const delta = ts - last;
  last = ts;
  square.style.transform = `rotate(${ts/1000}turn)`;
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
surmapro
0viewers