Noam Rosenthal noamr

Importing a script from external script:

// script.js
export const something = "foo";

// importing
import {something} from "script.js"

Importing a style from an external style, with @sheet:

Self-Review Questionnaire: Security and Privacy

What information does this feature expose, and for what purposes?

It does not expose information.

Do features in your specification expose the minimum amount of information necessary to implement the intended functionality?

VT and types: fallbacks

The use-case: a page where elements transition to each other, but only if they're loaded. If the page is only partially loaded without those elements, the whole root elements transitions with a fade.

Old document:

@view-transition {
 navigation: auto;

VT Use case for types

!!DEPRECATED!!

Music App

Going back to the original use case for types. We have a music app with 4 pages:

Home
Playlist

	async function after_next_paint() {
	const p = document.createElement("p");
	p.innerText = "1"
	p.style.transform = "rotateX(90deg)";
	p.style.pointerEvents = "none";
	p.style.position = "fixed";
	p.style.left = "0";
	p.style.top = "0";
	p.setAttribute("elementtiming", "foo");
	document.body.append(p);

	const track = new PerformanceTrack();

	// At some point
	track.mark(name);

	// At some other point
	track.mark(name);

	// Combines mark->mark as a single entry with duration
	track.measure(name);


	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())