https://github.com/malbernaz/tiny-history

A simple wrapper around the browser history API
https://github.com/malbernaz/tiny-history

Last synced: 1 day ago
JSON representation

A simple wrapper around the browser history API

• Host: GitHub
• URL: https://github.com/malbernaz/tiny-history
• Owner: malbernaz
• License: mit
• Created: 2017-07-26T01:02:35.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2018-08-15T20:29:28.000Z (over 6 years ago)
• Last Synced: 2025-01-05T18:17:14.162Z (8 days ago)
• Language: JavaScript
• Homepage:
• Size: 143 KB
• Stars: 3
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# tiny-history [![npm version](https://badge.fury.io/js/tiny-history.svg)](https://badge.fury.io/js/tiny-history) [![Build Status](https://travis-ci.org/malbernaz/tiny-history.svg?branch=master)](https://travis-ci.org/malbernaz/tiny-history) ![](http://img.badgesize.io/malbernaz/tiny-history/master/dist/tiny-history.js.svg?compression=gzip)

[![Build Status](https://saucelabs.com/browser-matrix/malbernaz.svg)](https://saucelabs.com/beta/builds/126cf589faff497d998c4bb515345011)

tiny-history is a simple wrapper around the browser history API. To some extent it mimics the behaviour of [history](https://github.com/ReactTraining/history), a module created by the good folks from [React Training](https://reacttraining.com/). Main differences from it are that:

- basename is not supported;

- blocking transitions is not supported;

## Why to use this

tiny-history's main selling point is it's size: ~500B minified and gzipped.

## How to install

```bash

npm i tiny-history

# or

yarn add tiny-history

```

Browser builds are also available on [unpkg](https://unpkg.com):

```html

  import createHistory from "//unpkg.com/tiny-history/dist/tiny-history.esm.js";

  /* ... */

```

## Usage

```js

import createHistory from "tiny-history";

const history = createHistory();

function doSomething(location, action) {

  /* do something */

}

// register a listener for route transitions

const unlisten = history.listen(doSomething);

// push a new route

history.push("pushed");

// replace a route

history.replace("replaced");

// transition to the previous route

history.back();

// transition to the next route

history.forward();

// transition to an entry of the history based on the index passed

history.go(-1);

// history.listen returns a callback that detaches the listener passed to it

unlisten();

```

## How to use tiny-history to replace history's `createBrowserHistory`

```js

import createHistory from "tiny-history";

const history = createHistory();

history.goForward = history.forward;

history.goBack = history.back;

export default history;

```

## LICENSE

[MIT](https://github.com/malbernaz/tiny-history/blob/master/LICENSE)