Skip to content

Latest commit

 

History

History

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 

README.md

Perspective Server / Client Architecture

Perspective Server Architecture

This directory provides examples of setting up a Perspective server/client architecture, where the server uses Python or Node.js APIs to connect to static or streaming data sources and updates Perspective viewers in a web browser for real-time interaction.


NOTE: his example is using Perspective version 3.4.3. You can modify the code to use a different version by selecting your desired release from the Perspective releases page.

Components

1. Perspective Server

Perspective provides Python, Node.js, and Rust APIs, enabling users to connect to real-time or batch data sources and stream results to Perspective viewers (clients) via WebSocket. The architecture is consistent across APIs.

  • Python: This example uses the perspective-python package with a Tornado server and PerspectiveTornadoHandler to establish the WebSocket. Other frameworks like FastAPI or Asyncio can be easily substituted.

  • Node.js: The example uses the @finos/perspective npm package and perspective.WebSocketServer to start the WebSocket server.

Both examples generate random stock market data updating every 250 milliseconds, showcasing high-speed updates. In real-world scenarios, this logic can be replaced to fetch data from the desired source at custom intervals.


NOTE: Data updates are handled asynchronously, ensuring the main server (Tornado or Node.js) event loop remains non-blocking.

2. Perspective Client

The client is a web application that connects to the Perspective server via WebSocket. It uses a custom WebAssembly-based <perspective-viewer> HTML component in a web browser, allowing users to interactively analyze and visualize data. The client can be built using any web framework (e.g., React, Vue, Angular) or even plain HTML/JavaScript.

In these examples we use a simple HTML page with a <perspective-viewer> component to display the data.

3. Data Transport Layer

We use WebSocket as the transport layer, allowing real-time updates and low-latency communication between the server and client. Perspective accomplishes very fast updates between the server and client using Arrow IPC and only transferring delta updates to the client.


Python Example

Navigate to the python directory.

Setup a python virtual environment and install the required packages:

cd python
python3 -m venv venv
source venv/bin/activate
pip install -r requirements.txt

Run the server:

python3 server.py

View index.html in your browser. You can use a local server like http-server or python -m http.server to serve the HTML file.

NOTE: Please use Chrome browser for the best experience. Other browsers may not support WebAssembly or WebSocket as well as Chrome does.


Node Example

Navigate to the node directory.

Install the required npm packages:

cd node
npm install

Run the server:

node server.js

Start a new terminal and start a Vite server:

npm run dev

View index.html using the Vite provided link: http://localhost:5173/index.html

NOTE: Please use Chrome browser for the best experience. Other browsers may not support WebAssembly or WebSocket as well as Chrome does.



Prospective

Perspective Architecture

Users can also use Prospective.co for free to connect to a Perspective server (and many other data sources) and build dynamic, sharable dashboards right away!

We highly recommend working with Prospective for building dashboards and data applications.