Browser Extension & Local-First OS

Syncly— Custom Platform Architecture

A high-performance Manifest V3 browser extension and new-tab productivity workstation engineered with clean architecture, zero build steps, and native Chrome bookmark synchronization. Features contextual workspaces, cross-folder collections, instant fuzzy search, omnibox integration, and multi-tier backups with 100% privacy and zero telemetry.

Visit Live Website
Fig. 001 — Production Architecture & Public Interface
Syncly preview
01 · The Problem

Cluttered Browser Bookmarks & Invasive Cloud Services

The Operational Bottleneck

Browser users with hundreds or thousands of bookmarks face a frustrating dilemma: native bookmark managers lack modern organization tools like workspaces, collections, and tag filtering, while third-party cloud bookmarking SaaS platforms require paid subscriptions, mandate cloud accounts, and compromise user privacy by sending browsing data to remote servers. Existing new-tab extensions are notoriously bloated, bundling multi-megabyte React frameworks and analytics trackers that slow down new tab opening speeds.

Core Risk:Data Privacy Leaks, Slow Tab Opens & Vendor Lock-In
Manual Friction Points
  • ✕Native browser bookmark managers lack contextual workspaces, collection bundling, and custom tag filtering.
  • ✕Third-party bookmark SaaS platforms mandate cloud accounts, send browsing history to remote servers, and lock basic features behind monthly subscriptions.
  • ✕Bloated new-tab extensions load multi-megabyte bundles with tracking pixels that noticeably degrade tab opening latency.
⚠️ Required Full Architectural Redesign
02 · The Strategy

Sync Everywhere, Stay Local — Native Chrome Transport & Zero Telemetry

Operate directly over the native chrome.bookmarks tree with w- prefix workspace conventions, chrome.storage.sync metadata mirroring, and pure ES module execution.

01

Clean Architecture & Frozen DI Container

A strict architectural separation where domain entities own business invariants without knowing about Chrome APIs, orchestrated by use cases and bound via a single frozen composition root.

Domain, Application Ports, Infrastructure, Presentation
02

Native Chrome Bookmarks Transport

Overcomes chrome.storage.sync quota limits (~8KB per item) by riding Chrome native bookmark synchronization for heavy folder hierarchies while mirroring metadata in sync storage.

Quota-Proof w- Prefix Workspace Protocol
03

Reactive EventBus Cross-Surface Sync

A lightweight synchronous pub/sub system wired to storage.onChanged listeners, ensuring any edit made in the popup, options page, or omnibox immediately updates all open new-tab instances.

Multi-Tab Real-Time Consistency
03 · The Build

Clean Architecture in Pure Vanilla JavaScript (Zero-Build MV3)

Engineered with strict DDD separation (Domain, Application Ports, Infrastructure, Presentation), frozen dependency injection container, and synchronous EventBus.

Dark Mode Dashboard & Contextual Deck
01 / Dashboard ViewHigh-density workspace layout with tag filtering and daily focus

Dark Mode Dashboard & Contextual Deck

Two-pane card deck layout featuring category grouping, auto-detected favicons, and daily productivity widgets.

Light Appearance Mode
02 / Light ThemeCrisp, high-contrast light theme engineered for daytime productivity

Light Appearance Mode

Clean daytime theme with customizable tint colors, button roundness tokens, and custom CSS overrides.

Contextual Workspaces Scoping
03 / WorkspacesDedicated workspace partitions with quota-proof Chrome sync

Contextual Workspaces Scoping

Organize bookmark folders into Work, Dev, and Personal contexts riding on native Chrome bookmark account transport.

Cross-Folder Themed Collections
04 / CollectionsCurated link bundles with auto-favicons and click analytics

Cross-Folder Themed Collections

Bundle related bookmarks into accessible collections across different folder trees without restructuring raw bookmarks.

Instant Omni-Search with Tag Matching
05 / Fuzzy SearchSub-millisecond fuzzy search modal with Ctrl+K shortcut

Instant Omni-Search with Tag Matching

Global fuzzy search across bookmark titles, URLs, and custom tags with direct nt omnibox address bar integration.

Minimalist Clean Mode
06 / Clean ModeZero-distraction focus mode for deep work and minimalist browsing

Minimalist Clean Mode

Streamlined distraction-free interface focusing purely on search, daily focus tasks, and essential bookmarks.

04 · The Impact

Sub-Millisecond Speed & Quota-Proof Multi-Device Sync

Under 500ms initial paint, <150ms bookmark deck loading for 500+ bookmarks, and seamless multi-device synchronization via Chrome native account transport.

< 500ms

First Contentful Paint

Industry Standard: 1,800ms

Zero-layout-shift synchronous cache hydration before async chrome.storage read.
< 150ms

Deck Load (500+ Items)

Traditional Extensions: 900ms

Granular DOM diffing and silent access count increments without full re-render.
< 5ms

Omni-Search Latency

Cloud SaaS APIs: 350ms

In-memory inverted index over bookmark titles, URLs, and custom #tags.
~150KB

Total JavaScript Payload

Typical Webpack Bundle: 3.5MB+

Zero-build vanilla ES modules with zero third-party runtime dependencies.
273 Tests

Unit & Integration Suite

100% Node.js Native Runner

Comprehensive domain invariant and storage client test coverage executing in < 1.2s.
0 Requests

Telemetry Network Traffic

Zero third-party analytics pixels

Total data sovereignty with 100% offline-capable local storage architecture.
“Syncly proves that you do not need heavy cloud backends or complex framework bundles to build world-class productivity software. Operating directly over native Chrome bookmarks while keeping all user data local is the pinnacle of thoughtful extension engineering.”
Open Source CommunityBrowser Architecture & Local-First OS
05 · Architecture Walkthrough

Clean Architecture & Data Flow Demonstration

Explore the inner workings of Syncly: DI composition root, EventBus synchronization across multiple tabs, and multi-tier backup engines.

Fig. 002 — Interactive Platform Screencast & User Flow● 4K Screencast In Production
Video Demo Coming Soon

Full System Walkthrough & Intake Flow

A detailed screencast demonstrating points calculation, automated intake triage, and headless CMS publishing is currently being recorded.

00:00 / 03:45
4K UHD● 60 FPS
Explore More Case StudiesAll Projects (5) →
Previous Case Study

atTrack Career Workspace

Local-first personal career OS and desktop AI copilot with multi-session streaming, vector search, and safety-gated tool execution.

Next Case Study

Visa Australia Legal

Enterprise migration law firm platform with automated client intake, headless CMS, and triple-tier security.

Build Your Custom Solution

Ready to engineer a platform like Syncly?

Whether you need a custom legal portal, scalable e-commerce storefront, or enterprise workflow platform, we take you from concept to production in 2–4 weeks with 100% code ownership.

Explore More Showcases
Fixed 2–4 Week Launch100% Code OwnershipZero Proprietary Lock-In

Join Our Newsletter

AtTech is an enterprise technology agency. Custom SaaS, AI automations, connected ecommerce & 30-day production sprints.

COMPANY
  • About Us
  • Services
  • Products
  • Open Source
  • Blog
  • Contact Us
SERVICES
  • AI & Automations
  • Full-Stack Development
  • E-Commerce & ERP
  • UI/UX Design
  • Graphics Design
Direct Booking

Talk With Our Team

30m Cal VideoUTC time (GMT+0)
August 2026
SuMoTuWeThFrSa
Available Times

No open slots on this date.

Project Brief

Have a Project in Mind?

Selected: August 28, 2026

© 2025 AtTech. All Rights Reserved.
attech
© 2025 AtTech. All Rights Reserved.