init commit
This commit is contained in:
linguini
@@ -0,0 +1,181 @@
|
||||
<html><head></head><body><h1>Backroundo — Architecture Roadmap</h1><h2>Project Philosophy</h2><p>Backroundo is a multi-stage engineering project.</p><p>The goal is not to build every component immediately, but to gradually evolve a simple artwork viewer into a distributed digital museum platform.</p><p>Each phase should produce a working system before moving forward.</p><p>The core principle:</p><blockquote><p>Build the museum room by room. Do not construct the entire building before hanging the first painting.</p></blockquote><hr><h1>Phase 0 — Foundation & Architecture Decisions</h1><h2>Goal</h2><p>Create the project structure and establish architectural rules.</p><h2>Tasks</h2><ul><li><p>Create repository structure.</p></li><li><p>Define service boundaries.</p></li><li><p>Decide communication patterns.</p></li><li><p>Define configuration strategy.</p></li><li><p>Create Docker development environment.</p></li><li><p>Create documentation structure.</p></li></ul><p>Suggested structure:</p><pre><code class="language-text">backroundo/
|
||||
|
||||
├── services/
|
||||
│ ├── web-go/
|
||||
│ ├── artwork-service-cpp/
|
||||
│ ├── metadata-worker-cpp/
|
||||
│ └── image-worker-cpp/
|
||||
│
|
||||
├── proto/
|
||||
│ └── artwork.proto
|
||||
│
|
||||
├── infrastructure/
|
||||
│ ├── docker/
|
||||
│ └── kubernetes/
|
||||
│
|
||||
├── storage/
|
||||
│
|
||||
└── docs/
|
||||
</code></pre><h2>Deliverable</h2><p>A clean project skeleton where every service can be started independently.</p><hr><h1>Phase 1 — The First Artwork</h1><h2>Goal</h2><p>Build the smallest working version.</p><p>The first milestone:</p><blockquote><p>One artwork exists in the system and can be viewed in the browser.</p></blockquote><h2>Architecture</h2><pre><code class="language-text">Browser
|
||||
|
||||
↓
|
||||
|
||||
Go Web Server
|
||||
|
||||
↓
|
||||
|
||||
Sqlite
|
||||
|
||||
↓
|
||||
|
||||
Image File
|
||||
</code></pre><h2>Build</h2><p>Database:</p><pre><code class="language-text">Artwork
|
||||
|
||||
id
|
||||
title
|
||||
artist
|
||||
file_path
|
||||
created_at
|
||||
</code></pre><p>Features:</p><ul><li><p>Add artwork manually.</p></li><li><p>Store metadata.</p></li><li><p>Display artwork.</p></li><li><p>Create artwork detail page.</p></li></ul><h2>Ignore For Now</h2><p>Do not add:</p><ul><li><p>RabbitMQ.</p></li><li><p>gRPC.</p></li><li><p>Search.</p></li><li><p>AI.</p></li><li><p>Kubernetes.</p></li></ul><h2>Deliverable</h2><p>A working artwork page:</p><pre><code class="language-text">localhost/artwork/1
|
||||
</code></pre><p>showing an image and metadata.</p><hr><h1>Phase 2 — Introduce Object Storage</h1><h2>Goal</h2><p>Stop treating images as ordinary files.</p><p>Move artwork assets into S3-compatible storage.</p><p>Possible solutions:</p><ul><li><p>GarageHQ.</p></li><li><p>SeaweedFS.</p></li><li><p>Other S3-compatible storage.</p></li></ul><h2>New Architecture</h2><pre><code class="language-text">Image
|
||||
|
||||
↓
|
||||
|
||||
Object Storage
|
||||
|
||||
↓
|
||||
|
||||
Database stores reference
|
||||
|
||||
↓
|
||||
|
||||
Browser loads image
|
||||
</code></pre><h2>Database Change</h2><p>Before:</p><pre><code class="language-text">file_path
|
||||
</code></pre><p>After:</p><pre><code class="language-text">storage_key
|
||||
</code></pre><p>Example:</p><pre><code class="language-text">originals/a8f92.jpg
|
||||
</code></pre><h2>Deliverable</h2><p>Artwork images are managed through object storage.</p><hr><h1>Phase 3 — Split the Backend</h1><h2>Goal</h2><p>Introduce service separation.</p><h2>Architecture</h2><pre><code class="language-text">Browser
|
||||
|
||||
↓
|
||||
|
||||
Go Web Server
|
||||
|
||||
↓
|
||||
|
||||
gRPC
|
||||
|
||||
↓
|
||||
|
||||
C++ Artwork Service
|
||||
</code></pre><h2>Responsibilities</h2><h3>Go Service</h3><p>Handles:</p><ul><li><p>HTTP requests.</p></li><li><p>HTML rendering.</p></li><li><p>Browser communication.</p></li></ul><h3>C++ Service</h3><p>Handles:</p><ul><li><p>Artwork logic.</p></li><li><p>Database interaction.</p></li><li><p>Business rules.</p></li></ul><h2>Deliverable</h2><p>The browser communicates with Go, and Go communicates with C++ through gRPC.</p><hr><h1>Phase 4 — Introduce RabbitMQ</h1><h2>Goal</h2><p>Move heavy operations into background workers.</p><h2>Architecture</h2><pre><code class="language-text">Artwork Event
|
||||
|
||||
↓
|
||||
|
||||
RabbitMQ
|
||||
|
||||
↓
|
||||
|
||||
Worker
|
||||
</code></pre><h2>First Worker</h2><p>Create Metadata Worker.</p><p>Responsibilities:</p><ul><li><p>Read filenames.</p></li><li><p>Extract metadata.</p></li><li><p>Update database.</p></li></ul><h2>Deliverable</h2><p>Background processing works asynchronously.</p><hr><h1>Phase 5 — Image Processing Pipeline</h1><h2>Goal</h2><p>Optimize image delivery.</p><p>Create Image Processing Worker.</p><p>Responsibilities:</p><ul><li><p>Generate thumbnails.</p></li><li><p>Convert images.</p></li><li><p>Compress images.</p></li><li><p>Create different resolutions.</p></li></ul><p>Example:</p><pre><code class="language-text">Original Image
|
||||
|
||||
↓
|
||||
|
||||
Image Worker
|
||||
|
||||
↓
|
||||
|
||||
thumbnail.webp
|
||||
preview.webp
|
||||
</code></pre><h2>Deliverable</h2><p>The application serves optimized images instead of huge originals.</p><hr><h1>Phase 6 — Build the Museum Interface</h1><h2>Goal</h2><p>Create the actual browsing experience.</p><h2>Frontend Stack</h2><ul><li><p>HTML.</p></li><li><p>HTMX.</p></li><li><p>CSS.</p></li></ul><h2>Features</h2><ul><li><p>Homepage.</p></li><li><p>Artwork pages.</p></li><li><p>Categories.</p></li><li><p>Gallery.</p></li><li><p>Downloads.</p></li></ul><h2>Gallery Design</h2><p>Use infinite scrolling.</p><p>The user sees:</p><pre><code class="language-text">24 artworks
|
||||
|
||||
↓
|
||||
|
||||
Scroll
|
||||
|
||||
↓
|
||||
|
||||
Load next 24 artworks
|
||||
|
||||
↓
|
||||
|
||||
Continue
|
||||
</code></pre><p>Implementation:</p><ul><li><p>Cursor-based loading.</p></li><li><p>Lazy-loaded images.</p></li><li><p>Thumbnail usage.</p></li></ul><h2>Deliverable</h2><p>The application feels like a digital museum.</p><hr><h1>Phase 7 — Search System</h1><h2>Goal</h2><p>Make the archive discoverable.</p><h2>Step 1</h2><p>Use Sqlite search.</p><p>Support:</p><ul><li><p>Title search.</p></li><li><p>Artist search.</p></li><li><p>Style filtering.</p></li></ul><h2>Step 2</h2><p>Add Elasticsearch.</p><p>Architecture:</p><pre><code class="language-text">Sqlite
|
||||
|
||||
↓
|
||||
|
||||
Search Indexer Worker
|
||||
|
||||
↓
|
||||
|
||||
Elasticsearch
|
||||
</code></pre><p>Features:</p><ul><li><p>Fuzzy search.</p></li><li><p>Autocomplete.</p></li><li><p>Ranking.</p></li><li><p>Fast filtering.</p></li></ul><h2>Deliverable</h2><p>Users can quickly find artwork in the archive.</p><hr><h1>Phase 8 — Visual Intelligence</h1><h2>Goal</h2><p>Add advanced discovery features.</p><p>This phase is optional.</p><hr><h2>Embedding Service</h2><p>Purpose:</p><p>Understand visual similarity.</p><p>Pipeline:</p><pre><code class="language-text">Artwork Image
|
||||
|
||||
↓
|
||||
|
||||
Embedding Model
|
||||
|
||||
↓
|
||||
|
||||
Vector Representation
|
||||
|
||||
↓
|
||||
|
||||
Vector Database
|
||||
</code></pre><p>Possible features:</p><ul><li><p>Find similar artwork.</p></li><li><p>Search visually.</p></li><li><p>Discover related paintings.</p></li></ul><hr><h2>AI Classification</h2><p>Optional fallback.</p><p>Example:</p><pre><code class="language-text">Reverse Search Failed
|
||||
|
||||
↓
|
||||
|
||||
AI Classifier
|
||||
|
||||
↓
|
||||
|
||||
Estimated Style
|
||||
</code></pre><p>AI should enhance the system, not become a requirement.</p><hr><h1>Phase 9 — Production Hardening</h1><h2>Goal</h2><p>Turn the project into a reliable system.</p><p>Add:</p><h2>Reliability</h2><ul><li><p>Health checks.</p></li><li><p>Error handling.</p></li><li><p>Retry strategies.</p></li><li><p>Backup systems.</p></li></ul><h2>Security</h2><ul><li><p>Rate limiting.</p></li><li><p>Input validation.</p></li><li><p>Secure communication.</p></li><li><p>Access control.</p></li></ul><h2>Observability</h2><ul><li><p>Logs.</p></li><li><p>Metrics.</p></li><li><p>Monitoring.</p></li><li><p>Alerts.</p></li></ul><h2>Deployment</h2><p>Prepare:</p><ul><li><p>Docker images.</p></li><li><p>Kubernetes deployment.</p></li><li><p>Scaling rules.</p></li></ul><hr><h1>Final Architecture</h1><p>Long-term vision:</p><pre><code class="language-text"> Browser
|
||||
|
||||
|
|
||||
|
||||
Go Web Server
|
||||
|
||||
|
|
||||
|
||||
gRPC
|
||||
|
||||
|
|
||||
|
||||
Artwork Service
|
||||
|
||||
+-------------+-------------+
|
||||
| |
|
||||
v v
|
||||
|
||||
Sqlite Object Storage
|
||||
|
||||
|
|
||||
|
||||
RabbitMQ
|
||||
|
||||
|
|
||||
|
||||
+-------+---------+
|
||||
| |
|
||||
v v
|
||||
|
||||
Metadata Worker Image Worker
|
||||
|
||||
|
||||
|
|
||||
|
||||
Search Indexer
|
||||
|
||||
|
|
||||
|
||||
Elasticsearch
|
||||
|
||||
|
||||
|
|
||||
|
||||
Embedding Pipeline
|
||||
|
||||
|
|
||||
|
||||
Vector Database
|
||||
</code></pre><hr><h1>Milestone Philosophy</h1><p>Do not measure progress by services created.</p><p>Measure progress by capabilities unlocked.</p><p>The milestones:</p><ol><li><p>One artwork displayed.</p></li><li><p>Artwork stored correctly.</p></li><li><p>Backend separated.</p></li><li><p>Background processing works.</p></li><li><p>Images optimized.</p></li><li><p>Museum interface exists.</p></li><li><p>Search works.</p></li><li><p>Intelligent discovery added.</p></li><li><p>Production quality achieved.</p></li></ol><hr><h1>Final Goal</h1><p>Backroundo becomes a private digital museum:</p><ul><li><p>Massive artwork collection.</p></li><li><p>Efficient storage.</p></li><li><p>Fast exploration.</p></li><li><p>Intelligent search.</p></li><li><p>Scalable backend.</p></li><li><p>Clean user experience.</p></li></ul><p>A system designed not just to display images, but to preserve, organize, and explore a growing digital archive.</p></body></html>
|
||||
Reference in New Issue
Block a user