npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

ng-http-cache

v1.2.0

Published

Speed up your remote requests by automatically caching them on client and add support for offline navigation.

Downloads

6

Readme

Angular HTTP Cache

What's this?

This project adds an "offline-first" approach to the regular Http service. Responses are saved to local persistence and then served from there on subsequent requests.

How does it work?

Basically, the module uses its own extended Http replacement service to save the response to every request into the browser's local persistence.

So for every request, the service will first look for a matching response in its local persistence; if it exists, it will emit that response first.

Regardless of the previous step, the service will perform the HTTP request and will emit updated data if necessary.

How to use it?

The module is a replacement for the native HttpModule, so it's intended to be easy to be dropped in.

Its methods are identical to the native module.

The code works fine with JSON-formatted HTTP responses. It can be also used for other types of responses, such as images, but it hasn't been properly tested yet, so please use with caution.

Installing it

npm install ng-http-cache --save

Importing it

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { HttpCacheModule } from 'ng-http-cache';

@NgModule({
  imports: [
    BrowserModule,
    HttpCacheModule
  ]
})
export class ExampleModule { }

Using it

import { Http } from '@angular/http';
export class ExampleComponent implements OnInit {
  constructor(private http: Http) { }

  ngOnInit() {
    this.http.get('http://api.example.com/example')
	  // There's no need to 'map' the response, the service does it for you!
      .subscribe((resp) => { 
        console.log(resp);
      });
  }
}

More stuff

Get in touch

Feel free to drop me a line if you have an issue, doubt, problem or suggestion, even just to tell me what you think. You can leave an issue here or give me a shout on Twitter.

To-do

  1. Check the network status and don't make the request if offline.
  2. Include unit tests.
  3. Add JSONP support.

License

MIT