DEV Community

Isoev.8
Isoev.8

Posted on

I Built an Offline-First HTTP Request Queue for Angular

#angular #typescript #web #react

GitHub

Have you ever had a user submit a form, lose their internet connection, and watch their request fail?

I wanted to solve this problem in Angular without forcing developers to build their own queue, IndexedDB storage, retry logic, and network synchronization.

So I built ngx-offline-sync — an open-source Angular library for offline-first HTTP request synchronization.

How it works

When the application is online, requests work normally through Angular's HttpClient.

When the connection is lost:

HTTP Request
     ↓
Offline
     ↓
Queue
     ↓
IndexedDB
Enter fullscreen mode Exit fullscreen mode

The request is persisted locally instead of simply being lost.

Once the connection comes back:

IndexedDB
    ↓
Sync
    ↓
HTTP Request
    ↓
Completed
Enter fullscreen mode Exit fullscreen mode

What it currently supports

  • Automatic queuing of POST, PUT, PATCH, and DELETE requests
  • IndexedDB persistence
  • Automatic synchronization after reconnect
  • Retry handling
  • Request status tracking
  • Parallel queue processing with batchSize
  • Angular HTTP interceptor integration
  • No additional dependencies required

The goal is to keep the API simple — you continue using Angular's HttpClient as usual.

Example 

provideOfflineSync({
  batchSize: 5,
});
Enter fullscreen mode Exit fullscreen mode

That's it. The library handles the queue and synchronization infrastructure for you.

The project is still evolving, and I'm working on improving the API, documentation, testing, and network-state handling.

If you're working with Angular and building applications where network interruptions are a real possibility, I'd love for you to take a look.

GitHub
npm

Top comments (0)