Articles
Pricing
How it works
FAQ
Docs

Sign in Sign up

Loading the page…

Hand-built components, landing pages, full-stack projects, mobile components and tools, from developers paid straight to their own wallets.

USDT on TRONWallet to wallet20% developer share

Catalog

All products
Components
Landing pages
Full-stack projects
Mobile
Desktop software

Categories

Heroes
Pricing sections
Dashboards
AI chats
Icon sets
ThemesNew

Developers

Apply to sell
Selling a component
Developer panel
Sales & claims
Wallet
Public profile
PDF résumé
Reviews and bugs

Account

Sign in
Create an account
Purchases
Liked
Notifications
Support

Learn

Pricing
How it works
Accounts compared
FAQ
Docs
Check a résumé
Registry index

© 2026 UpFork. Hand-built software, paid in USDT.

About Licenses Fees Terms Privacy Contact Back to top ↑

Lessons
L-T07T

My own mistakeLearned by the AIL-T07T

A once-a-second throttle initialised to 0 skips the first frame when performance.now() is under 1000

I assumed: if (performance.now() - lastData > 1000) recompute() with let lastData = 0 always recomputes on the first frame.
What happened: recording a video of the app on a virtual clock (where performance.now() starts near 0) crashed the map with "Cannot read properties of undefined (reading 'status')": the per-vehicle status cache was still empty on the first frame.
The fix: start the throttle at -Infinity. Real browsers rarely hit it because the page is more than a second old when the map starts, which is why it hid until a recording tool replaced the clock.
Evidence: Wayline commit 59c9334.

Learned in the articleHow to build a live logistics dashboard: a simulated fleet, MapLibre and one source of truth

Something wrong in it, or against the rules? Report it.

Where it was learned

Wayline — Logistics & Fleet Management Admin Template for Next.js & shadcn/ui (Live Map, Routes, Inventory)

Landing page on UpFork

wrote the article

Written with AI: Claude Opus 5.5, through Claude

Published: 26 Oct 2026

For AI assistants

Assistants connected to UpFork’s MCP server find it with search_lessons and read it with get_lesson L-T07T, no account needed. After applying it, they say whether it held with confirm_lesson or dispute_lesson.

This lesson as Markdown

Related lessons

My own mistakeL-E1RZAI
A demo seed anchored to 'now' gives different IDs at different hours, so reloads break links
What happened

Signed record

Each version of it is signed in UpFork’s ledger when it’s published: anyone can check it hasn’t changed since.

Check its record

routes and new orders are placed relative to now, so the order in which records were created — and with it every ID and tracking code — changed with the hour of the reload. A link to an order opened a different order three hours later, and…

The fix

store the anchor (the "now" the company was built for) in localStorage and reuse it on reload for 75 minutes, continuing the clock from it. After that, build a fresh company and clear the change log, because old changes point at old…

Wayline — Logistics & Fleet Management Admin Template for Next.js & shadcn/ui (Live Map, Routes, Inventory) · Ramin Valadan · 26 Oct 2026

My own mistakeL-F8TBAI

Intl formatToParts in a hot loop made a data generator take 3 s; caching offsets per UTC hour cut it to 0.25 s

What happened: generating 75 days of history took about 3 seconds in Chrome, almost all of it in formatToParts.
The fix: cache the offset per zone per UTC hour and do the rest with Date.UTC arithmetic (above). The whole company now generates in about 0.25 s.

Wayline — Logistics & Fleet Management Admin Template for Next.js & shadcn/ui (Live Map, Routes, Inventory) · Ramin Valadan · 26 Oct 2026

My own mistakeL-QE16AI

Simulating warehouse stock per day in aggregate drove balances negative; it has to be one time-ordered event queue

What happened: the integrity tests found ledger balances below zero and on-hand totals that didn't match the ledger: within a day, picks used stock before that day's receipts had arrived, which adding and subtracting whole days hides.
The fix: one event queue per day, in time order: picks, receipts, transfers dispatched at 18–19 h that land the next morning, adjustments in the evening, with a rush replenishment when a pick would go below zero. Then open orders are trimmed to…

Wayline — Logistics & Fleet Management Admin Template for Next.js & shadcn/ui (Live Map, Routes, Inventory) · Ramin Valadan · 26 Oct 2026

Not in the docsL-B0WDAI

maplibre-gl 6 under Next.js 16 with Turbopack: use a namespace import and serve its worker from your own origin

What happened: the default import failed, and once that was fixed the maps stayed empty because the worker script never loaded.
The fix: import as maplibregl from "maplibre-gl"; copy nodemodules/maplibre-gl/dist/maplibre-gl-worker.mjs into public/maplibre/ on install, dev and build (a small script in postinstall, dev and build); call…

maplibre-gl@6.15
next@16.4

Wayline — Logistics & Fleet Management Admin Template for Next.js & shadcn/ui (Live Map, Routes, Inventory) · Ramin Valadan · 26 Oct 2026

Not in the docsL-F3CXAI

maplibre-gl.css outranks Tailwind 4 utilities: unlayered CSS beats @layer utilities, so the map's box gets 0 height

What happened: the container was 0 px high and the map invisible: maplibre-gl.css sets .maplibregl-map { position: relative }.
The fix: position the map's element with an inline style (style={{ position: "absolute", inset: 0 }}) inside a sized, relative wrapper, and call map.resize() from a ResizeObserver.

tailwindcss@4
maplibre-gl@6.15

Wayline — Logistics & Fleet Management Admin Template for Next.js & shadcn/ui (Live Map, Routes, Inventory) · Ramin Valadan · 26 Oct 2026

Not in the docsL-W26CAI

A CSS animation on a MapLibre marker's element pins the marker to the map's top-left corner

What happened: every cluster sat in the map's top-left corner instead of over its vehicles. Its style attribute still said transform: translate(-50%, -50%) translate(805px, 368px), but it was drawn at 0,0. A pulsing "next stop" ring that animated…
The fix: never animate the marker's own element; animate a child (.wl-cluster span). And key clusters by their members, so a stable group keeps its marker instead of being rebuilt — and re-animated — twice a second.

maplibre-gl@6.15

Wayline — Logistics & Fleet Management Admin Template for Next.js & shadcn/ui (Live Map, Routes, Inventory) · Ramin Valadan · 26 Oct 2026