Skip to content

feat: Free static asset hosting alternative to Cloudflare Images (no credit card required) #4

Description

@luojiyin1987

Feature Request: Free Static Asset Hosting Alternative to Cloudflare Images

Problem

The default worker/index.ts template uses Cloudflare Images for image optimization, which requires a paid subscription ($5/month minimum) and a credit card on file.

For hobby projects, startups, or developers in regions where credit cards are hard to obtain, this creates an unnecessary barrier to entry.

Current Behavior

// worker/index.ts uses env.IMAGES binding
const result = await env.IMAGES.input(body)
  .transform(width > 0 ? { width } : {})
  .output({ format, quality });

This requires:

  • Cloudflare Images paid plan
  • Credit card on file
  • Additional costs for storage and transformations

Proposed Solution

Add a free alternative using Cloudflare Pages for static asset hosting:

  1. Static assets (images, 3D models) → Cloudflare Pages (free, unlimited bandwidth)
  2. Dynamic logic (SSR, API routes) → Cloudflare Workers (free tier: 100K req/day)
  3. No Cloudflare Images binding needed

Implementation

Option A: Documentation Only

Add a guide showing how to:

  • Remove IMAGES binding from worker
  • Deploy static assets to Pages separately
  • Reference Pages URL for images/models

Option B: Built-in Support

Add configuration option in vite.config.ts:

export default defineConfig({
  plugins: [
    vinext({
      // New option: use Pages for static assets
      staticAssets: {
        enabled: true,
        // Auto-deploy to Pages during `vinext deploy`
        projectName: 'my-app-static',
      },
    }),
  ],
});

Benefits

  1. Zero cost for static assets (Pages free tier)
  2. No credit card required
  3. Better separation of concerns (static vs dynamic)
  4. Simpler architecture for small projects

Workaround (Current)

We implemented this manually:

  1. Removed IMAGES binding from worker/index.ts
  2. Created deploy-pages.sh script
  3. Deploy static assets separately to Pages
  4. Reference https://<project>.pages.dev for images
# Deploy static assets
wrangler pages deploy public/ --project-name=my-app-static

# Deploy worker (without Images binding)
wrangler deploy

Environment

  • vinext version: latest
  • Deployment target: Cloudflare Workers + Pages
  • Node.js: 22.x

Additional Context

This approach works well for:

  • 3D model viewers (GLB files)
  • Image-heavy applications
  • Projects with large static assets
  • Developers without credit cards

Would the team consider adding built-in support or at minimum, documenting this free alternative?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions