Build native, high-performance, cross-platform desktop apps with reason!
🚧 NOTE: Revery is a work-in-progress and in active development! 🚧
Install esy
esy is like npm for native code. If you don't have it already, install it by running:
npm install -g esy
esy installesy build
If your build takes too much time then you can pre-install some libraries:
brew install cmakebrew install libpng ragel
Install the following packages with your package manager of choice:
cmakeragel
libpng-devlibbz2-devm4xorg-devlibglu1-mesa-dev
No additional dependencies needed.
NOTE:
esyrequires building from an Administrator prompt (eithercmd.exeorPowershell).
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: (microsoft/WSL#637 and a potential workaround)
After building, you can run the example app by running:
esy x Examples
Check out our examples to see how they work!
Tests can be run with:
esy b dune runtest
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?
- 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.
Check out revery-quick-start to get up and running with your own Revery app!
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);TODO
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
- Quickstart / Hello World
- Calculator
- Todo List
Revery is provided under the MIT License.
We'd love your help, and welcome PRs and contributions. Join us on Discord!
Some ideas for getting started:
- Help us build example apps,
- Help us implement missing features,
- Help us log bugs and open issues.
revery would not be possible without a bunch of cool tech:
- ocaml made these tools possible - thanks Inria & OCaml Labs!
- reasonml made revery possible - thanks @jordwalke!
- flex by @jordwalke
- briskml
- brisk-reconciler - the "native React" implementation.
- reason-glfw
- reason-fontkit
- reason-gl-matrix
revery was inspired by some awesome projects: