(new PerformanceObserver((list) => {
const entries = list.getEntriesByType('layout-shift');
entries.forEach((/*LayoutShift*/entry) => {
console.log(entry);
const /*Array<LayoutShiftAttribution>*/sources = entry.sources || [];
const changes = [];
for (const source of sources) {
const { currentRect: cr, previousRect: pr, node } = source;
const dx = cr.x - pr.x;
const dy = cr.y - pr.y;
const ds = cr.width * cr.height - pr.width * pr.height;
changes.push({dx, dy, ds, node});
}
if (changes.length) {
console.table(changes);
}
});
})).observe({ type: 'layout-shift', buffered: true });
