runtime-info
Nano untility library for JavaScript runtime detection
Purpose
This is important for SSR/SSG, isomorphic runtime code checks: Should certain code be executed or not? Some code works only on server, some code works in browser, and some in browser, but not in WebWorkers.
Instead of a weak if (typeof window !== 'undefined') { ... }
etc. checks which are easy to mistaken
you can use this safe, fast and nano sized library. Using it gives you more readble code and reliability.
Features
✅ JavaScript runtime checks:isBrowser()
,isServer()
,isWebWorker()
✅ Just174 byte
nano sized (ESM, gizpped)✅ Tree-shakable, side-effect free, so maybe just58 byte
for you✅ Zero dependencies✅ First class TypeScript support✅ 100% Unit Test coverage
Install
- yarn:
yarn add runtime-info
- npm:
npm install runtime-info
Use
import { isBrowser, isServer, isWebWorker } from 'runtime-info'
if (isBrowser()) {
// safely use window, location, etc. here
}
if (isServer()) {
// safely use Node.js/Deno API's here like process
}
if (isWebWorker()) {
// safely use postMessage() inside of a webworker
}
ESM
import { isBrowser, isServer, isWebWorker } from 'runtime-info'
if (isBrowser()) {
// safely use window, location, etc. here
}
if (isServer()) {
// safely use Node.js/Deno API's here like process
}
if (isWebWorker()) {
// safely use postMessage() inside of a webworker
}
const { isBrowser, isServer, isWebWorker } = require('runtime-info')
// same API like ESM variant
CommonJS
const { isBrowser, isServer, isWebWorker } = require('runtime-info')
// same API like ESM variant
One thing about JSDOM
If you're running inside of a server-side environment where globals like window
and document
are defined (JSDOM), then you're effectively running in a browser-compatible environment, and
this library will return true
for isBrowser
and false
for isServer
. This is an edge case.
You can check for this using the following code: navigator.userAgent.includes("jsdom")