Page Won’t Load

When a page fails to load in RuntimeWeb or StudioWeb, follow these steps to identify the cause.

Symptoms

• Blank white or black canvas
• “Page not found” or error message
• Page partially renders with missing objects
• Browser console shows errors

Diagnosis Steps

Step 1: Check the Page File Exists

Page JSON files must be in apps/runtime-web/public/pages/:

ls apps/runtime-web/public/pages/ | grep "your_page"

If the file is missing, you need to either:

• Convert it from ASC: cd apps/asc2web && npx tsx src/cli.ts ../../asc/your_page.asc -o ../../apps/runtime-web/public/pages/
• Or create it in StudioWeb and save it

Step 2: Validate the JSON

Open the .json file and check for syntax errors:

python3 -m json.tool apps/runtime-web/public/pages/your_page.json > /dev/null

Common JSON issues:

• Trailing commas
• Missing closing braces
• Unquoted property names
• Invalid UTF-8 characters

Step 3: Check Browser Console

Open DevTools (F12 → Console) and look for:

Step 4: Verify the Dev Server

The Vite dev server must be running:

cd apps/runtime-web
npm run dev

Check that it’s accessible at http://localhost:5173.

Step 5: Check Page Structure

A valid page JSON must have:

{
  "objects": [
    {
      "id": "...",
      "x": 0, "y": 0,
      "width": 100, "height": 100
    }
  ]
}

Each object needs at minimum: id, x, y, width, height. Dynamic objects also need objectType.

Step 6: Hard Refresh

The browser may be caching an old version:

• Ctrl+Shift+R (hard refresh)
• Or clear browser cache and reload

Common Causes

See Also

• Loading Your First Page
• Export & Import Pages
• Common Issues