Skip to content

Instantly share code, notes, and snippets.

View lebreRafael's full-sized avatar

Rafael Bonalume Lebre lebreRafael

View GitHub Profile
@noamr
noamr / whynp.js
Last active May 28, 2024 17:20
WhyNP: Analyze LoAFs & event timing entries to find cause of bad INP
(function() {
let pending_loaf_entries = [];
let pending_event_entries = [];
let timeout_handle = null;
const combined_map = new Map();
function print() {
const entries = [...combined_map.entries()].sort((a, b) => b.duration - a.duration);
console.log(entries.map(([loaf, event]) => {
let longest_script = null;
@kevlened
kevlened / analytics.js
Last active June 8, 2024 13:33
Manually Deobfuscated Google Analytics js
/*
*
* This is currently a WIP
* Source originally pulled 3/28/2018
* https://www.google-analytics.com/analytics.js
*
* Tools:
* 1) Google Chrome source formatter
* 2) VS Code right-click rename symbol
*
@paulirish
paulirish / what-forces-layout.md
Last active July 22, 2024 06:32
What forces layout/reflow. The comprehensive list.

What forces layout / reflow

All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.

Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.

Element APIs

Getting box metrics
  • elem.offsetLeft, elem.offsetTop, elem.offsetWidth, elem.offsetHeight, elem.offsetParent