December 15, 2023
Preparing a VPS move as photos grow
Preparing a VPS move for growing photo storage and traffic.
Planning & operations
Platform
#Platform
eric

Photos show aspects of an arcade that names, addresses and game lists cannot. They also consume resources when stored and each time someone views them. Even with the same photo count, larger files mean more transferred data.

We are currently selecting images and reducing quality to stay within free-hosting limits. That approach makes it difficult to keep adding photos, so we have begun preparing a VPS move for Next.js and PocketBase.

Image storage and data transfer

Storage is the space occupied by files on the server; transfer is the data sent to visitors. Adding photos affects both. Their future use is harder to estimate if treated like small name and address fields.

Vercel's free allowance is becoming tighter, and the free backend has used more than roughly 3.5GB of its 5GB storage limit. These figures describe the situation now. Remaining space still calls for planning if each additional photo continues the same growth.

Mermaid
flowchart TD
    accTitle: Photos meet free hosting limits
    accDescr: Growing storage and transfer usage led to image selection and quality reduction.
    A["More arcade photos"] --> B
    B["More storage and transfer usage"] --> C
    C["Select images and reduce quality"]

Compression and migration options

The immediate response is to choose which images to retain and reduce their size. This lowers storage and transfer, but an entrance or cabinet-layout photo becomes less useful if its details are blurred.

We therefore began investigating server operation rather than relying on further compression alone. The move would cover both Next.js, which serves the interface, and PocketBase, which handles data. We are evaluating the destination and arrangement, not reporting a completed migration.

Mermaid
flowchart TD
    accTitle: What to investigate for a VPS move
    accDescr: Investigate a common entry point that separates page and data requests.
    A["Incoming requests"] --> B
    B["Reverse proxy proposal"] --> C
    C["Next.js and PocketBase"]

VPS hosting and reverse proxies

A VPS is a rented, virtually divided server on which we run the programs needed. It offers more choice of placement than managed hosting, but requires understanding where requests arrive and which program receives them. This is why I am studying IP and TCP.

The proposed arrangement receives requests at a common entry point and directs interface requests to Next.js and data requests to PocketBase. That routing component is called a reverse proxy. The diagram explains the proposal rather than a finalized deployment or address.

Mermaid
flowchart TD
    accTitle: Control and responsibility
    accDescr: Choosing resources also requires preparation for processes, connections and failure response.
    A["Consider VPS operation"] --> B
    B["Choose resources and service placement"] --> C
    C["Prepare process, connection and incident handling"]

Preparing for server operations

Choosing resources directly creates more room to decide photo quantity and quality. A VPS still has storage and transfer constraints; renting one does not remove image costs.

Program availability, connections and places to inspect during failures also become our responsibility. The current work is to understand and prepare that operating scope. Solving resource use requires planning not only where files reside, but how the service will keep providing them.

Reference: Musecat engineering notes.

Musecat
All About Arcades