@grpc/grpc-js vs grpc-web
gRPC in Web Development Comparison
Search packages..
3 Years
@grpc/grpc-jsgrpc-webSimilar Packages:
What's gRPC in Web Development?

gRPC (gRPC Remote Procedure Calls) is a modern, high-performance framework for building remote procedure call (RPC) APIs. It uses HTTP/2 for transport, Protocol Buffers (protobuf) as the interface description language, and provides features like bi-directional streaming, authentication, and more. gRPC is designed for low-latency, high-throughput communication between microservices, making it ideal for cloud-native applications. It supports multiple programming languages, allowing for cross-platform interoperability. gRPC is particularly well-suited for scenarios where performance and efficiency are critical, such as real-time applications, IoT, and large-scale distributed systems.

Package Weekly Downloads Trend
Github Stars Ranking
Stat Detail
Package
Downloads
Stars
Size
Issues
Publish
License
@grpc/grpc-js16,582,520
4,7141.97 MB2213 months agoApache-2.0
grpc-web96,903
9,00145.2 kB2062 years agoApache-2.0
Feature Comparison: @grpc/grpc-js vs grpc-web

Platform Support

  • @grpc/grpc-js:

    @grpc/grpc-js is designed for Node.js environments, providing a full-featured gRPC implementation that supports all gRPC features, including streaming, authentication, and more. It is suitable for server-side applications and microservices running on Node.js.

  • grpc-web:

    grpc-web is specifically designed for web browsers, allowing client-side applications to communicate with gRPC services. It works around browser limitations by using a lightweight protocol that translates gRPC calls into HTTP/1.1 or HTTP/2, making it compatible with web environments.

Streaming Support

  • @grpc/grpc-js:

    @grpc/grpc-js fully supports gRPC streaming, including bi-directional streaming, allowing for real-time communication between clients and servers. This makes it suitable for applications that require continuous data exchange, such as chat applications, live updates, and more.

  • grpc-web:

    grpc-web supports streaming, but with some limitations compared to the full gRPC implementation. It allows for server-side streaming and bi-directional streaming, but the client-side streaming capabilities are limited due to browser constraints. This makes it suitable for applications that need one-way or limited two-way streaming.

Authentication and Security

  • @grpc/grpc-js:

    @grpc/grpc-js supports advanced authentication mechanisms, including SSL/TLS, token-based authentication, and custom authentication plugins. It provides robust security features for server-to-server communication and is suitable for enterprise-grade applications that require secure data transmission.

  • grpc-web:

    grpc-web supports SSL/TLS for secure communication between web clients and gRPC servers. However, it relies on the server to handle authentication, as the client-side implementation is limited. This makes it suitable for applications that require secure communication but may not support complex authentication mechanisms.

Code Generation

  • @grpc/grpc-js:

    @grpc/grpc-js works seamlessly with Protocol Buffers (protobuf) for code generation. Developers can define their gRPC services and messages in .proto files, and use tools like protoc to generate the necessary client and server code. This allows for strong typing and efficient serialization of data.

  • grpc-web:

    grpc-web also uses Protocol Buffers for code generation, but it requires additional configuration to generate code that is compatible with web browsers. Developers need to use specific plugins or tools to generate the client-side code that works with the grpc-web protocol.

Ease of Use: Code Examples

  • @grpc/grpc-js:

    @grpc/grpc-js Example

    const grpc = require('@grpc/grpc-js');
const protoLoader = require('@grpc/proto-loader');

// Load the protobuf
const packageDefinition = protoLoader.loadSync('service.proto');
const proto = grpc.loadPackageDefinition(packageDefinition);

// Create a gRPC client
const client = new proto.MyService('localhost:50051', grpc.credentials.createInsecure());

// Call a method
client.myMethod({ name: 'World' }, (error, response) => {
  if (error) {
    console.error('Error:', error);
  } else {
    console.log('Response:', response);
  }
});
  • grpc-web:

    grpc-web Example

    import { MyServiceClient } from './generated/service_grpc_web_pb';
import { MyRequest } from './generated/service_pb';

// Create a gRPC-Web client
const client = new MyServiceClient('https://my-grpc-server.com');

// Create a request
const request = new MyRequest();
request.setName('World');

// Call a method
client.myMethod(request, {}, (error, response) => {
  if (error) {
    console.error('Error:', error);
  } else {
    console.log('Response:', response.getMessage());
  }
});
How to Choose: @grpc/grpc-js vs grpc-web
  • @grpc/grpc-js:

    Choose @grpc/grpc-js if you are building a Node.js application that requires full gRPC capabilities, including support for streaming, authentication, and advanced features. It is a pure JavaScript implementation of gRPC, making it suitable for server-side applications and providing better performance compared to older implementations.

  • grpc-web:

    Choose grpc-web if you need to enable gRPC communication from web browsers. It is designed for client-side applications that need to interact with gRPC services while adhering to browser security restrictions. grpc-web is ideal for applications that require lightweight, efficient communication with gRPC backends from the browser.

Similar Npm Packages to grpc-web

grpc-web is a JavaScript library that allows web applications to communicate with gRPC services. It provides a way to make gRPC calls from the browser, enabling developers to build rich, interactive web applications that can leverage the power of gRPC for efficient communication with backend services. By using grpc-web, developers can take advantage of gRPC's features, such as bi-directional streaming and protocol buffers, while still adhering to the constraints of web browsers.

While grpc-web is a powerful tool for integrating gRPC with web applications, there are alternatives worth considering:

  • @grpc/grpc-js is a pure JavaScript implementation of gRPC that runs in Node.js and the browser. It is designed to be a more modern and flexible alternative to the original gRPC library. Unlike grpc-web, which is specifically tailored for web applications, @grpc/grpc-js can be used in various environments, including server-side applications. This library allows developers to use gRPC features without the need for a separate proxy, making it a suitable choice for projects that require a more comprehensive gRPC solution.
  • @improbable-eng/grpc-web is another library that enables gRPC communication in web applications. It provides a more flexible approach to gRPC-web integration and is designed to work seamlessly with existing gRPC services. This library focuses on performance and ease of use, allowing developers to quickly set up gRPC calls in their web applications. If you are looking for an alternative that emphasizes performance and simplicity, @improbable-eng/grpc-web may be the right choice for your project.

To see how grpc-web compares with @grpc/grpc-js and @improbable-eng/grpc-web, check out the comparison: Comparing @grpc/grpc-js vs @improbable-eng/grpc-web vs grpc-web.

README for @grpc/grpc-js

Pure JavaScript gRPC Client

Installation

Node 12 is recommended. The exact set of compatible Node versions can be found in the engines field of the package.json file.

npm install @grpc/grpc-js

Documentation

Documentation specifically for the @grpc/grpc-js package is currently not available. However, documentation is available for the grpc package, and the two packages contain mostly the same interface. There are a few notable differences, however, and these differences are noted in the "Migrating from grpc" section below.

Features

  • Clients
  • Automatic reconnection
  • Servers
  • Streaming
  • Metadata
  • Partial compression support: clients can compress and decompress messages, and servers can decompress request messages
  • Pick first and round robin load balancing policies
  • Client Interceptors
  • Connection Keepalives
  • HTTP Connect support (proxies)

If you need a feature from the grpc package that is not provided by the @grpc/grpc-js, please file a feature request with that information.

This library does not directly handle .proto files. To use .proto files with this library we recommend using the @grpc/proto-loader package.

Migrating from grpc

@grpc/grpc-js is almost a drop-in replacement for grpc, but you may need to make a few code changes to use it:

  • If you are currently loading .proto files using grpc.load, that function is not available in this library. You should instead load your .proto files using @grpc/proto-loader and load the resulting package definition objects into @grpc/grpc-js using grpc.loadPackageDefinition.
  • If you are currently loading packages generated by grpc-tools, you should instead generate your files using the generate_package_definition option in grpc-tools, then load the object exported by the generated file into @grpc/grpc-js using grpc.loadPackageDefinition.
  • If you have a server and you are using Server#bind to bind ports, you will need to use Server#bindAsync instead.
  • If you are using any channel options supported in grpc but not supported in @grpc/grpc-js, you may need to adjust your code to handle the different behavior. Refer to the list of supported options below.
  • Refer to the detailed package comparison for more details on the differences between grpc and @grpc/grpc-js.

Supported Channel Options

Many channel arguments supported in grpc are not supported in @grpc/grpc-js. The channel arguments supported by @grpc/grpc-js are:

  • grpc.ssl_target_name_override
  • grpc.primary_user_agent
  • grpc.secondary_user_agent
  • grpc.default_authority
  • grpc.keepalive_time_ms
  • grpc.keepalive_timeout_ms
  • grpc.keepalive_permit_without_calls
  • grpc.service_config
  • grpc.max_concurrent_streams
  • grpc.initial_reconnect_backoff_ms
  • grpc.max_reconnect_backoff_ms
  • grpc.use_local_subchannel_pool
  • grpc.max_send_message_length
  • grpc.max_receive_message_length
  • grpc.enable_http_proxy
  • grpc.default_compression_algorithm
  • grpc.enable_channelz
  • grpc.dns_min_time_between_resolutions_ms
  • grpc.enable_retries
  • grpc.max_connection_age_ms
  • grpc.max_connection_age_grace_ms
  • grpc.max_connection_idle_ms
  • grpc.per_rpc_retry_buffer_size
  • grpc.retry_buffer_size
  • grpc.service_config_disable_resolution
  • grpc.client_idle_timeout_ms
  • grpc-node.max_session_memory
  • grpc-node.tls_enable_trace
  • grpc-node.retry_max_attempts_limit
  • grpc-node.flow_control_window
  • channelOverride
  • channelFactoryOverride

Some Notes on API Guarantees

The public API of this library follows semantic versioning, with some caveats:

  • Some methods are prefixed with an underscore. These methods are internal and should not be considered part of the public API.
  • The class Call is only exposed due to limitations of TypeScript. It should not be considered part of the public API.
  • In general, any API that is exposed by this library but is not exposed by the grpc library is likely an error and should not be considered part of the public API.
  • The grpc.experimental namespace contains APIs that have not stabilized. Any API in that namespace may break in any minor version update.
npm-compare.com is an independent website designed to help developers choose the most suitable npm packages. We are not affiliated with npm, Inc or npmjs.com, the official website for the npm registry. Please note that npm is a registered trademark of npm, Inc. For more details, please refer to our Terms & Privacy.