- Products
- Developers
- User stories
- Blog
- Pricing
Announcing PusherJS 3.1: Supporting ReactNative, Service Workers and NodeJS
Recently we had been working on our isomorphic JavaScript library as a way of experimenting on how to create a codebase that builds for a range of runtimes.
Introduction
JavaScript is no longer about script tags in HTML. In recent times, a range of exciting new runtimes have opened up to allow us to use the language for amazing, bleeding-edge things. That can be NodeJS running on servers and IoT devices, React Native to create great UX for cross-platform mobile apps, or browser workers to enhance UI performance.
Recently we had been working on our isomorphic JavaScript library as a way of experimenting on how to create a codebase that builds for a range of runtimes. Paweł Ledwon has written recently about how we did this. That was great, but it dropped support for legacy browsers, so we couldn’t give it official support.
Since then we have taken what we learnt from the process and applied it to our official codebase. We have made our library extensible, such that it can be run in all these exciting new runtimes that can benefit from Pusher, and without any drop in browser support.
As a result, we’re very happy to announce PusherJS 3.1, which keeps support for legacy browsers such as IE7, while also adding capability for React Native, web workers and NodeJS.
Changes
First of all, there are no breaking changes.
We have added a convenience logging function if users wish to log directly to the console. If they do not wish to supply a custom logger with Pusher.log = function(){...}, they can use Pusher.logToConsole = true.
We also have new steps if you wish to self-host your JavaScript files. Other changes, which include bug fixes and internal changes, can be read on the library’s changelog.
Getting Started
On The Web
Getting started on the web is no different to previous versions. Simply link in the CDN ( https://js.pusher.com/3.1/pusher.js ) and get started:
1<head> 2 <title>Pusher</title> 3 <script src="https://js.pusher.com/3.1/pusher.min.js"></script> 4 <script> 5 6 var pusher = new Pusher('key', { 7 encrypted: true 8 }); 9 10 var channel = pusher.subscribe('test_channel'); 11 channel.bind('my_event', function(data) { 12 alert(data.message); 13 }); 14 </script> 15</head>
If you’re using a bundler such as Webpack, JSPM or Browserify, you can run:
1$ npm install pusher-js
Then you can require Pusher and get started:
1var Pusher = require('pusher-js'); 2 3var pusher = new Pusher('key', { 4 encrypted: true 5});
Alternatively, using ES2015+ imports:
1import Pusher from 'pusher-js'; 2// etc.
On React Native
Having installed pusher-js via NPM, you can import "pusher-js/react-native" to get set up:
1import Pusher from 'pusher-js/react-native'; 2 3var pusher = new Pusher('key', { 4 encrypted: true 5});
On Web Workers
This build supports a range of workers – including SharedWorkers and ServiceWorkers, which will help you do useful stuff, like share connections across browser tabs or windows.
In your worker script, just use importScripts to bring in the library via the CDN. Note that the file is called pusher.worker.js and not pusher.js. As usual, minified builds contain a min.js suffix.
1importScripts("https://js.pusher.com/3.1/pusher.worker.min.js"); 2 3var pusher = new Pusher('key', { 4 encrypted: true 5});
Please note that HTTP fallbacks will only be in place if the worker environment supports XMLHttpRequest. A fetch fallback is under consideration for workers that do not, and do let us know if you think this is important.
On NodeJS
Some customers may wish to use PusherJS to listen for messages in a server environment. Note that this is not a replacement for our Node server library, but simply a version of our client library that runs on Node.
Requiring "pusher-js/node", having installed PusherJS from NPM, will give you access to the Node build:
1var Pusher = require('pusher-js/node'); 2 3var pusher = new Pusher('key', { 4 encrypted: true 5}); 6 7// ...
Let Us Know How You Get On
Feel free to tweet us and tell us how you get on with using PusherJS in new environments. If you have any ideas for new runtimes we could support or improvements to existing builds, drop us a PR.
We’re very excited about this new version of PusherJS, and we hope that you enjoy it and end up writing awesome stuff with it.
© 2024 Pusher Ltd. All rights reserved.
Pusher Limited is a company registered in England and Wales (No. 07489873) whose registered office is at MessageBird UK Limited, 3 More London Riverside, 4th Floor, London, United Kingdom, SE1 2AQ.