Skip to content

Latest commit

 

History

History
 
 

view

Folders and files

NameName
Last commit message
Last commit date

parent directory

..
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

tracespace view

https://tracespace.io/view

Probably the best Gerber viewer on the internet. @tracespace/view uses the pcb-stackup library to render Gerber and NC drill files as SVGs in your browser, without ever sending your files to a server.

Your renders are saved locally, so you can check out your boards without constantly having to re-upload your Gerber files.

architecture

The app is very similar to a typical React + Redux application. A central state store is available all through-out the app, and much of the UI is derived directly from that state.

The state can be changed by dispatching a specific action to the store, which will fold the action into the state. As the action is being processed, it will pass through a series of middleware that can trigger side-effects, like triggering a render.

For more information, see the state module

rendering

The app runs pcb-stackup and various file reading libraries in a separate thread from the main UI via a Web Worker. The render worker responds to and emits application store actions via the [render middleware][render-middleware]/

For more information, see the render module.

local storage

Source files and their associated renders, as well as application preferences, are stored locally using IndexedDB. The app has two databases:

  • BoardDatabase
    • Accessed exclusively by the render worker
    • Stores board information, layer information, and source files
  • AppDatabase
    • Accessed from the main UI thread via the settings middleware
    • Stores application preferences and information

analytics

The tracespace view application collects anonymous usage data if you opt-in to tracking. See the analytics module for more information

debugging

To debug the application state, you can change the app's log level using your browser's JavaScript console:

localStorage.setItem('logLevel', 'debug')

Available log levels are:

  • debug (default in development)
  • info
  • warn (default in production)
  • error

At logLevel: 'debug', all actions and state changes will be logged