Skip to content

feat: carry kgu.one's departure dots into the first paint - #13

Open
SamGu-NRX wants to merge 8 commits into
mainfrom
kgu-continuation
Open

SamGu-NRX wants to merge 8 commits into
mainfrom
kgu-continuation

Conversation

@SamGu-NRX

@SamGu-NRX SamGu-NRX commented Oct 6, 2026 •

Copy link
Copy Markdown
Owner

What changed

When a visitor leaves kgu.one for this site, kgu.one draws a grid of ink dots over its own page, starting at the link they clicked, and the browser keeps that frame on screen until this site paints. The root layout now inlines a 4.8 KB script (2.2 KB brotli) in <head>, from src/app/kgu-arrival.ts. Next places its charset, viewport and stylesheet links ahead of it; the first paint waits for those stylesheets too, so the script still runs before it. It carries those dots on: this site's first frame has the same dots from the same point, so the cut between the two sites changes only the page under the dots. When the first screen is ready, the dots clear, nearest the click first.

The script reads #kgu=<x>,<y>,<rrggbb>,<ms> from the address: the click as fractions of the window, the dots' colour and the click's time. It removes the hash at once, so a reload or a copied link loads the site as usual. From the click's time it draws the dots as they stood when the browser stopped showing kgu.one (about when this page's response started), and lets them finish growing from there. A hash more than 4 s old draws nothing, so a bookmarked or shared address with the hash in it loads the site as usual.

The dots wait until the page has parsed, its fonts and first-screen images are ready and nothing larger has painted for 150 ms, for 1.5 s at most. Where the browser reports no paints, they wait instead until the page has text to show, then 150 ms. Just before they go, the script checks the first screen's images and fonts again, one check at a time, and waits for any image on it that is still loading, since an app renders after the document is parsed. The click is kept as the same fraction of the window, so a scrollbar the page's own CSS adds doesn't move it. Then they clear over 320 ms. A tap, scroll or swipe starts the clearing at once. A key press, reduced motion switched on, or a hidden tab removes them with no motion.

Without the hash the script adds no element, attribute, listener or timer. kgu.one sends the hash only to hosts on its continuation list, which stays empty for this host until this is merged and live. It sends none under reduced motion, in forced colours or for a keyboard activation, because it draws no dots then.

While a page arrives this way, <html> has data-kgu-arrival for the rest of its life. A rule in globals.css uses it to show the hero's text, marked data-kgu-intro, in place from the first frame instead of fading it up after hydration. The call-to-action row still fades in after hydration, as on a direct visit, so its buttons never show before they work.

The script is minified from kgu.one's scripts/continuation/arrive.ts, whose unit tests run both the source and this minified copy. The comment above the copy carries the start of the source's SHA-256 (f987b955c836), so a stale copy is easy to spot.

UI changes

kgu.one's last frame (left) and Connvo's first frame (right), after the same click on kgu.one's Connvo page, at 1440 × 900 in full headless Chromium. Connvo is next start of this branch (5b5fa09), its HTML delayed 300 ms as a network would delay it. Before: today's kgu.one and main. After: kgu.one with this host on its list.

For a listed site, kgu.one also holds a capture of the site's first frame. Under the dots, its own page turns into that capture, from the click, before it navigates, so the frame the browser holds is Connvo's first frame under the same dots. The two frames now differ by 9.8 of 255 on average (1.4 at 390 × 844, 8.6 in the dark theme), where today they differ by 37. What remains is height: the hero is centred in the window, and kgu.one took its capture at 1440 wide in a window 950 px tall, so in this 900 px window the hero sits about 25 px higher.

Before After
Before: kgu.one's page under the dots, then Connvo with no dots After: Connvo's capture under kgu.one's dots, then Connvo under the same dots

In the dark theme (after only):

After, dark: Connvo's dark capture under kgu.one's light dots, then Connvo under the same dots

The frames from the cut until the dots have cleared:

The arrival frame by frame: Connvo under the dots, the dots clearing from the click

The departure and arrival at normal speed, then at quarter speed:

arrival.mp4
arrival-quarter-speed.mp4

The images and video show 5b5fa09. Later commits (to cc33929) no longer hold the call-to-action row in place on arrival: it fades in after hydration, as on a direct visit, so its buttons never show before they work. Its first frame under the dots therefore has the hero's text without the buttons. I have not re-recorded it.

How to try it

With your usual .env.local, run pnpm dev and open http://localhost:3000/. In the browser's console, run location.replace("/?try#kgu=0.500,0.400,1c1b19," + Date.now()). The hash needs a fresh time, so it cannot be typed into the address bar. On a fast local load the dots show only briefly; throttle the network in DevTools to watch them hold and then clear.

Verification

  • At 5b5fa09: pnpm test:run passed (240 tests in 17 files) twice in a row; one earlier run had one failing test that did not fail again. pnpm build fails as it does on main, while prerendering an /app/professional/* page that calls useSearchParams() outside a Suspense boundary, so I built with next build --experimental-build-mode compile and made-up values for NEXT_PUBLIC_CONVEX_URL and the WorkOS settings; nothing signed in.
  • CI won't run on this PR: every job in .github/workflows/ci.yml has runs-on: upnpmtu-latest.
  • I recorded next start of that build, served to headless Chromium and WebKit as connvo.app, arriving from a local kgu.one build whose list names this host and which holds a capture of this build. All other network was blocked. Chromium at 1440 × 900 (light and dark) and 390 × 844, WebKit at 1440 × 900. In every run the dots were on the page from its first frame and gone 1.4 to 1.7 s after the click, and the address had no hash afterwards.
  • kgu.one's unit tests cover this script: the hash, the resume from the held frame, and that a reload or an old hash draws nothing.

These were headless browsers on one machine. Nobody has tried it on a phone or in desktop Safari.

Risk

  • The hero rule covers the elements marked data-kgu-intro. A new hero element that fades in would need the same mark.

Checklist

  • The scope is focused; related changes belong together
  • I explained what changed and why
  • I included before/after images for visible changes
  • I included a video for motion or interaction changes

🤖 Generated with Claude Code

Summary by CodeRabbit

  • New Features
    • Added a brief visual arrival effect when opening a supported link with a valid position and recent timestamp in its URL.
    • The effect respects motion preferences and accessibility settings, and stops when visitors interact with the page or it is no longer visible.
    • The hero introduction remains visible and clear while the effect runs. The effect ends when the page is ready or the animation is interrupted.

Arriving from kgu.one with #kgu=<x>,<y>,<rrggbb>, an inline script in the root
layout's <head> draws kgu.one's scan dots over the first frame from the same
click, then takes them away nearest the click first once the first screen has
rendered. While it arrives, the hero is shown in place instead of fading up
under the dots. Without the hash nothing changes.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
@vercel

vercel Bot commented Oct 6, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
connvo Error Error Oct 7, 2026 6:15am UTC

@chatgpt-codex-connector

Copy link
Copy Markdown

You have reached your Codex usage limits for code reviews. You can see your limits in the Codex usage dashboard.
To continue using code reviews, add credits to your account and enable them for code reviews in your settings.

@coderabbitai

coderabbitai Bot commented Oct 6, 2026 •

Copy link
Copy Markdown

Review in Change Stack →

Warning

Review limit reached

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

Next included review available in 2 minutes.

Check out review usage here.

View limit details

Limit details: You’ve used the included review currently available.

Learn how review limits work.

Review configuration:

⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: e205fe27-fe5b-4855-a1d8-77ec5b282c5a
📥 Commits

Reviewing files that changed from the base of the PR and between 51a022b and cc33929.

📒 Files selected for processing (1)
  • src/app/kgu-arrival.ts

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: ebb2ccc3-30f4-467a-90fa-5d8c386af924
📥 Commits

Reviewing files that changed from the base of the PR and between 5b5fa09 and 51a022b.

📒 Files selected for processing (2)
  • src/app/kgu-arrival.ts
  • src/app/page.tsx
💤 Files with no reviewable changes (1)
  • src/app/page.tsx

Included review availability: This review used your included allowance. Your plan provides up to 1 included review per hour; 0 remain after this review.


📝 Walkthrough

Walkthrough

The layout runs an inline script that processes qualifying KGU arrival hashes. When its time, accessibility, and visibility checks pass, the script draws a timed canvas effect. Four hero elements have arrival markers, and scoped CSS overrides their opacity and transforms on arrival pages.

Changes

KGU Arrival Effect

Layer / File(s) Summary
Parse and render the arrival effect
src/app/kgu-arrival.ts, src/app/layout.tsx
The layout runs KGU_ARRIVAL inline. The script parses and removes qualifying hashes, checks eligibility, and draws and clears a canvas effect.
Mark and style the hero
src/app/page.tsx, src/app/globals.css
Four hero elements receive data-kgu-intro attributes. A scoped CSS rule sets their opacity to 1 and removes transforms on arrival pages.

Priority: ⬇️ Low

Estimated code review effort: 3 (Moderate) | ~20 minutes

Change: Feature

Sequence Diagram(s)

sequenceDiagram
  participant Browser
  participant RootLayout
  participant KGU_ARRIVAL
  participant Canvas
  Browser->>RootLayout: Load document
  RootLayout->>KGU_ARRIVAL: Run inline script
  KGU_ARRIVAL->>KGU_ARRIVAL: Validate and consume KGU hash
  KGU_ARRIVAL->>Canvas: Draw and clear timed effect
Loading

Merge Risk: ⚪ Minimal · up to 51a02

Visits that arrive with a fresh kgu.one hash get a short dot effect over the hero. Direct visits are unaffected. The change has not been tried on a phone or in desktop Safari, but no concrete defect has been found.

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 3 files. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly summarizes the main change: carrying kgu.one’s departure dots into the first paint.
✨ Finishing Touches 💡 2
📝 Generate docstrings 💡
  • Commit to this branch
  • Create a new PR
🛠️ Fix failing CI checks 💡
  • Commit to this branch
  • Create a new PR
  • Autopilot · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@codemetrics-ai

codemetrics-ai Bot commented Oct 6, 2026

Copy link
Copy Markdown

Note

Review skipped

Codemetrics is installed on this repository, but it hasn't been added to your team yet.

To enable AI code reviews for this repo, go to your dashboard and add Connvo to your team's repositories.

The dots now wait for the first screen to paint, leave at once if the visitor
taps, types or scrolls, and are removed if the tab is hidden. Under reduced
motion nothing is drawn. Copied from kgu.one's scripts/continuation/arrive.ts.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Updates kgu.one's arrival script: a page hidden before it committed draws
nothing, and dots still waiting a second past the cap go without a leaving.
Copied from kgu.one's scripts/continuation/arrive.ts.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
kgu.one's departure now builds its dots evenly from the click, and for a
site with a capture of its first frame it dissolves into that capture
under the dots. The hash gains the click's time (#kgu=x,y,rrggbb,ms), so
this page draws the field as it stands at its first frame and ignores an
address that was bookmarked or shared. A key press, or reduced motion
turned on while arriving, removes the dots at once with no motion.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Chromium holds kgu.one's last frame from about when this page's response
starts, so the dots pick up from that frame instead of jumping ahead.
They are drawn to the window's full height, and follow the client box
while the page's own CSS loads.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
…horter comment

On an arrival from kgu.one, controls that need JavaScript now fade in
after hydration as they do on a direct visit, instead of showing before
they work. The arrival script checks the first screen's images and
fonts again just before its dots go, and keeps kgu.one's click as the
same fraction of the window when the page's scrollbar narrows it.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
@SamGu-NRX

Copy link
Copy Markdown
Owner Author

@coderabbitai review

@coderabbitai

coderabbitai Bot commented Oct 7, 2026 •

Copy link
Copy Markdown
⚠️ Action not completed

Already reviewed the last commit. Use @coderabbitai full review to rerun a review of the entire changeset.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

…t reported

The arrival script no longer lets two close paint reports clear the dots
past a pending image, waits for each image request and font round once,
and, where the browser reports no paints, holds until the page has text
to show. The comment above the copy says only why it is here.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
@SamGu-NRX

Copy link
Copy Markdown
Owner Author

@coderabbitai review

@coderabbitai

coderabbitai Bot commented Oct 7, 2026 •

Copy link
Copy Markdown
⚠️ Action not completed

Review rate limited.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

While a reused image element loads its new picture, the browser keeps
naming the old one, so the arrival script let the replacement through.
It now waits for any first-screen image that is still loading, within
its 1.5 s cap.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
@SamGu-NRX

Copy link
Copy Markdown
Owner Author

@coderabbitai review

@coderabbitai

coderabbitai Bot commented Oct 7, 2026 •

Copy link
Copy Markdown
⚠️ Action not completed

Review rate limited.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

This branch had an error being deployed

1 failed deployment
Preview — cc339292 Deployed Oct 7, 2026 by vercel[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant