🚀 Big News: Socket Acquires Coana to Bring Reachability Analysis to Every Appsec Team.Learn more
Socket
Book a DemoInstallSign in
Socket

json-perf-loader

Package Overview
Dependencies
Maintainers
1
Versions
10
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

json-perf-loader

A loader for webpack to load JSON with performance advice

1.1.0
latest
Source
npm
Version published
Maintainers
1
Created
Source

json-perf-loader

ci cover npm download deps

A loader for webpack to load JSON with performance advice.

The cost of parsing JSON

See The cost of parsing JSON - V8

Because the JSON grammar is much simpler than JavaScript’s grammar, JSON can be parsed more efficiently than JavaScript. This knowledge can be applied to improve start-up performance for web apps that ship large JSON-like configuration object literals (such as inline Redux stores). Instead of inlining the data as a JavaScript object literal.

As long as the JSON string is only evaluated once, the JSON.parse approach is much faster compared to the JavaScript object literal, especially for cold loads. A good rule of thumb is to apply this technique for objects of 10 kB or larger — but as always with performance advice, measure the actual impact before making any changes.

Getting Started

To begin, you'll need to install json-perf-loader:

$ npm install json-perf-loader --save-dev

json-perf-loader works like json-loader, but much faster.

index.js

import json from './file.json'

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.json$/i,
        type: 'javascript/auto',
        use: [
          {
            loader: 'json-perf-loader',
            options: {
              limit: 4096,
            },
          },
        ],
      },
    ],
  },
}

And run webpack via your preferred method.

Note: type: "javascript/auto" is require. See https://webpack.js.org/configuration/module/#ruletype

Rule.type sets the type for a matching module. This prevents defaultRules and their default importing behaviors from occurring. For example, if you want to load a .json file through a custom loader, you'd need to set the type to javascript/auto to bypass webpack's built-in json importing.

Options

limit

Type: Number|String Default: 1024 * 10

The limit can be specified via loader options and defaults to 1024 * 10. This is the recommended value for the V8 team.

Number

A Number specifying the maximum size of a file in bytes. If the file size is equal or greater than the limit JSON.parse will be used.

webpack.config.js

module.exports = {
  module: {
    rules: [
      {
        test: /\.json$/i,
        type: 'javascript/auto',
        use: [
          {
            loader: 'json-perf-loader',
            options: {
              limit: 10,
            },
          },
        ],
      },
    ],
  },
}

License

MIT

Keywords

webpack

FAQs

Package last updated on 25 Feb 2021

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts