| const next_frame = () => Promise(resolve => requestAnimationFrame(ts => resolve(ts)); | |
| async function get_img_presentation_time(img) { | |
| // Wait until image is fully loaded | |
| await new Promise(resolve => img.complete ? resolve() : img.addEventListener("load", resolve)) | |
| let frame_timestamp = await next_frame(); | |
| // Wait until we have the frame timestamp soonest after the image was decoded. |
| const events = []; | |
| let current_dequeue_end = 0; | |
| function dequeue() { | |
| // Ready to process, will send all current events. | |
| current_dequeue_end = events.length; | |
| fetchLater(makeURL(events)).then(({activated}) => { | |
| if (activated) { | |
| // Success, remove processed sub-array from the array and reset the index. | |
| events.splice(0, current_deque_end); | |
| current_dequeue_end = 0; |
| (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; |
| function hasPendingIncomingTransition() { } | |
| function isRenderBlocked() { } | |
| function continueIncomingTransition() { } | |
| let hasSeenFold = false; | |
| let lastFoldCheckTime = performance.now(); | |
| const FoldCheckThrolttle = 100; | |
| function didSeeFold() { | |
| if (hasSeenFold || !hasPendingIncomingTransition()) |
| (function init() { | |
| function processAndFilterLoAFs(entries) { | |
| function floorObject(o) { | |
| return Object.fromEntries(Array.from(Object.entries(o)).map(([key, value]) => [key, typeof value === "number" ? Math.floor(value) : | |
| value | |
| ])) | |
| } | |
| function processEntry(entry) { | |
| const startTime = entry.startTime; |
| <!DOCTYPE html> | |
| <head> | |
| <meta name="view-transition" content="same-origin"> | |
| </head> | |
| <body> | |
| <style> | |
| h1 { | |
| view-transition-name: hero; | |
| } |
| class UserlandPendingBeacon { | |
| #abortController = null; | |
| // Let's imagine it's a list of plain objects. | |
| #pendingEntries = []; | |
| // URL, headers, defer options etc | |
| #requestInit; | |
| constructor(requestInit) { |
| function parseHTML(getNextElement) { | |
| let doneParsing = null; | |
| const whenDoneParsing = new Promise(resolve => { doneParsing = resolve; }); | |
| while (const element = getNextElement()) { | |
| if (element.tagName !== "SCRIPT") { | |
| // parse everything else... | |
| continue; | |
| } |