⚡️ Native, high-performance, cross-platform desktop apps - built with Reason!
Branch: master
Clone or download
bryphe Initial release packages (#340)
Build: Publish release packages
Latest commit e14abb3 Feb 15, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.ci Initial release packages (#340) Feb 16, 2019
esy.lock Upgrade to reason-fontkit@2.2.1 (#338) Feb 14, 2019
examples Text wrapping (#300) Feb 14, 2019
playground Minor tweaks for playground (#317) Feb 8, 2019
screenshots [ImgBot] Optimize images (#279) Jan 29, 2019
scripts Initial release packages (#340) Feb 16, 2019
src Fix #342: Slider not updating values as mouse moves (#343) Feb 15, 2019
test API: onDimensionsChanged event (#336) Feb 14, 2019
.gitattributes Initial release packages (#340) Feb 16, 2019
.gitignore feature/radio-buttons (#254) Jan 26, 2019
CODE_OF_CONDUCT.md Create CODE_OF_CONDUCT.md Jan 24, 2019
LICENSE Initial commit Sep 19, 2018
README.md Dependency: esy -> 0.5.6 (#320) Feb 12, 2019
Revery.opam Sketch out initial source tree Sep 24, 2018
Revery_Core.opam API: Colors (#12) Oct 20, 2018
Revery_Geometry.opam Geometry Builder / Initial Geometry (#7) Oct 6, 2018
Revery_Math.opam Refactoring: Add Revery_Math module (#80) Nov 30, 2018
Revery_Native.opam Native Integration: Platform alert dialog (#276) Jan 29, 2019
Revery_Shaders.opam Factor BasicShader to subfolder (#6) Oct 5, 2018
Revery_UI.opam Initial integration with 'flex' for UI (#9) Oct 19, 2018
Revery_UI_Components.opam Start module for 'Revery.UI.Components' (#138) Dec 22, 2018
azure-pipelines.yml Initial release packages (#340) Feb 16, 2019
dune Initial "playground" for examples (#314) Feb 8, 2019
dune-project CI: Use dune for formatting (#267) Feb 11, 2019
esy.lock.json Feature/Dropdown Component (#268) Feb 11, 2019
package.json Initial release packages (#340) Feb 16, 2019

README.md

Build Status npm version Join the chat on discord!

Revery

Build native, high-performance, cross-platform desktop apps with reason!

🚧 NOTE: Revery is a work-in-progress and in active development! 🚧

Slider components

To get a taste of Revery, check out our JavaScript + WebGL build on the playground. For the best experience, though, you'll want to try a native build 👇

Building & Installing

Install esy

esy is like npm for native code. If you don't have it already, install it by running:

npm install -g esy

NOTE: Revery requires esy at version 0.5.6+

Building

  • esy install
  • esy build

For macOS users

If your build takes too much time then you can pre-install some libraries:

  • brew install cmake
  • brew install libpng ragel

For Linux users

Install the following packages with your package manager of choice:

  • cmake
  • ragel
For Ubuntu you may need these additional packages
  • libpng-dev
  • libbz2-dev
  • m4
  • xorg-dev
  • libglu1-mesa-dev

For Windows native

No additional dependencies needed.

NOTE: esy requires building from an Administrator prompt (either cmd.exe or Powershell).

For Windows Subsystem for Linux (WSL)

Make sure to check the specific requirements for your Linux distribution, above.

NOTE: Hardware acceleration is not enabled by default in WSL (instead, WSL will fall-back to a software renderer). This is problematic for performance - for that reason, we recommend building and running Revery natively on Windows instead of with WSL. For more info see: (https://github.com/Microsoft/WSL/issues/637 and a potential workaround)

Running

After building, you can run the example app by running:

  • esy x Examples

Check out our examples to see how they work!

Tests

Tests can be run with:

  • esy b dune runtest

Motivation

Today, Electron is one of the most popular tools for building desktop apps - using an HTML, JS, CSS stack. However, it has a heavy footprint in terms of both RAM and CPU - essentially packing an entire browser into the app. Even with that tradeoff, it has a lot of great aspects - it's the quickest way to build a cross-platform app & it provides a great development experience - as can be testified by its usage in popular apps like VSCode, Discord, and Slack.

Revery is kind of like super-fast, native Electron - with bundled React-like/Redux-like libraries and a fast build system - all ready to go!

Revery is built with reasonml, which is a javascript-like syntax on top of OCaml This means that the language is accessible to JS developers.

Your apps are compiled to native code with the Reason / OCaml toolchain - with instant startup and performance comparable to native C code. Revery also features GPU-accelerated rendering. The compiler itself is fast, too!

Revery is an experiment - can we provide a great developer experience and help teams be productive, without making sacrifices on performance?

Design Decisions

  • Consistent cross-platform behavior

A major value prop of Electron is that you can build for all platforms at once. You have great confidence as a developer that your app will look and work the same across different platforms. Revery is the same - aside from platform-specific behavior, if your app looks or behaves differently on another platform, that's a bug! As a consequence, Revery is like flutter in that it does not use native widgets. This means more work for us, but also that we have more predictable functionality cross-platform!

NOTE: If you're looking for something that does leverage native widgets, check out briskml. Another alternative is the cuite OCaml binding for Qt.

  • High performance

Performance should be at the forefront, and not a compromise - we need to develop and build benchmarks that help ensure top-notch performance and start-up time.

  • Type-safe, functional code

We might have some dirty mutable objects for performance - but our high-level API should be purely functional. You should be able to follow the React model of modelling your UI as a pure function of application state -> UI.

Quickstart

Check out revery-quick-start to get up and running with your own Revery app!

API Example

Here's a super simple Revery app, demonstrating the basic API surface:

/**
 * The 'main' function for our app.
 */
let init = app => {
  /* Create a window! */
  let win = App.createWindow(app, "test");

  /* Set up some styles */
  let textHeaderStyle =
    Style.[
      backgroundColor(Colors.black),
      color(Colors.white),
      fontFamily("Roboto-Regular.ttf"),
      fontSize(24),
    ];

  /* Set up render function */
  let render = () => {
    <view
      style={Style.[
        position(`Absolute),
        bottom(10),
        top(10),
        left(10),
        right(10),
        backgroundColor(Colors.blue),
      ]}>
      <view
        style={Style.[
          position(`Absolute),
          bottom(0),
          width(10),
          height(10),
          backgroundColor(Colors.red),
        ]}
      />
      <image src="logo.png" style={Style.make(~width=128, ~height=64, ())} />
      <text style=textHeaderStyle> "Hello World!" </text>
      <view
        style={Style.[
          width(25),
          height(25),
          backgroundColor(Colors.green),
        ]}
      />
    </view>;
  };

  /* Start the UI */
  UI.start(win, render);
};

/* Let's get this party started! */
App.start(init);

Custom Components

TODO

Roadmap

It's early days for revery and we still have a lot of work ahead!

Some tentative work we need to do, in no particular order:

  • UI Infrastructure
    • Styles
    • State management / Redux-like layer
    • Focus Management
    • Input handling
    • Animations
    • Gestures
    • Transforms
    • Compositing / Container
    • zIndex / layers
  • UI Components
    • View
    • Image
    • Text
    • Input
    • Button
    • Slider
    • Checkbox
    • ScrollView
  • Platform support
    • Windows
    • OSX
    • Linux
    • Web (JS + Wasm)
  • Mobile support
    • Compilation to iOS
    • Compilation to Android
  • Developer Experience
    • Hot reloading
    • 'Time travel' debugging across states
    • Integrated debugger
    • Integrated performance profiler
  • Audio Support
    • Wav file playback
    • MP3 file playback
  • Example apps

License

Revery is provided under the MIT License.

Contributing

We'd love your help, and welcome PRs and contributions. Join us on Discord!

Some ideas for getting started:

Special Thanks

revery would not be possible without a bunch of cool tech:

revery was inspired by some awesome projects: