nanovg VS yoga

Compare nanovg vs yoga and see what are their differences.

nanovg

Antialiased 2D vector drawing library on top of OpenGL for UI and visualizations. (by memononen)

yoga

Yoga is an embeddable layout engine targeting web standards. (by facebook)
InfluxDB - Power Real-Time Data Analytics at Scale
Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.
www.influxdata.com
featured
SaaSHub - Software Alternatives and Reviews
SaaSHub helps you find the best software and product alternatives
www.saashub.com
featured
nanovg yoga
18 23
5,018 16,926
- 0.5%
1.7 9.5
about 2 months ago 14 days ago
C C++
zlib License MIT License
The number of mentions indicates the total number of mentions that we've tracked plus the number of user suggested alternatives.
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.

nanovg

Posts with mentions or reviews of nanovg. We have used some of these posts to build our list of alternatives and similar projects. The last one was on 2023-08-21.
  • nanovg VS nitro-gl - a user suggested alternative
    2 projects | 21 Aug 2023
  • Cairo – Open-Source 2D Graphics Layer/API with Fonts and Many Back-Ends
    6 projects | news.ycombinator.com | 17 Jul 2023
  • 2D graphics lib recommendation?
    6 projects | /r/C_Programming | 20 Apr 2023
    I use nanovg for my projects and it works surprisingly well for its size. It integration is pretty simple .... if you know a little bit of OpenGL, otherwise there is a slight learning curve.
  • minimax — minimalist 3D game engine in Clojure
    5 projects | /r/Clojure | 26 Feb 2023
    The "engine" is built on top of amazing https://www.lwjgl.org/ and https://github.com/bkaradzic/bgfx/, and UI system is baked by https://github.com/memononen/nanovg and https://github.com/facebook/yoga
  • Randazzo: PMDG 737 Unstable with SU11 Beta.
    1 project | /r/flightsim | 13 Oct 2022
    It's a library for drawing vector shapes, sort of like SVG - https://github.com/memononen/nanovg The old way in the SDK was with GDI+, but the benefit of a vector format is scalability to higher resolutions and better GPU usage. The workaround potentially costs some frames, but its better than bust panels for now.
  • Simple 2D game
    1 project | /r/opengl | 15 Aug 2022
    If you are a beginner in computer graphics, I strongly suggest you to look at the nanovg library: it contains all the primitives you might want to render (circles, lines, filled polygons, text, images, ...). Integrating it in existing codebase is not that hard, since the library is rather small.
  • W4 Games formed to strengthen Godot ecosystem
    3 projects | news.ycombinator.com | 9 Aug 2022
    NanoVG is the closest thing I came across when I had a similar quesiton: https://github.com/memononen/NanoVG

    unfortunately it doesn't seem like it's getting steady updates now unlike the last time I checked. But I imagine it's pretty mature at this point. There also seem to be ports in Metal/DX11 if you didn't want to be stuck in OpenGL.

  • Why are there so little Skia recources?
    3 projects | /r/GraphicsProgramming | 6 Aug 2022
    Also there's NanoVG if you really want a vector api in C, but don't need anti-aliased clipping.
  • Advice for the next dozen Rust GUIs
    14 projects | news.ycombinator.com | 15 Jul 2022
    Getting sufficient antialiasing quality for 2D graphics is difficult on GPUs. https://github.com/memononen/nanovg accomplishes this with GL2/GLES2 level hardware for most of the stuff one would want to render as part of a GUI. My project https://github.com/styluslabs/nanovgXC supports rendering arbitrary paths with exact coverage antialiasing, but requires GLES3.1 or GL4 level hardware for reasonable performance.
  • Ask HN: Modern Alternatives to C
    5 projects | news.ycombinator.com | 30 Apr 2022
    > to learn the 'nuts and bolts' of rendering

    These nuts and bolts are very different between CPU and GPU. CPU-based libraries are painting pixels in bitmaps in system memory. Most GPU-based libraries are uploading indexed triangle meshes, and rendering them with weird shaders.

    Worse, there're no good open source implementations of GPU-based ones. Microsoft ships an implementation as a part of OS (Direct2D) but it's not open source. Linux simply doesn't have an equivalent.

    At least for initial versions, consider C interop with this https://github.com/memononen/nanovg It cuts a few corners (no cleartype for text, CPU overhead for repeated rendering of same static paths) but it's still good overall, simple, and easy to use.

    > My only concern with C# is the cross compatibility

    Works well on Linux, Windows and OSX, including ARM CPUs. Not sure about Android and iOS, never tested.

    My largest concern with C# would be performance. Technically the language allows to code in any style, but most guides and examples are using OO-heavy one.

yoga

Posts with mentions or reviews of yoga. We have used some of these posts to build our list of alternatives and similar projects. The last one was on 2024-03-21.
  • Show HN: Dropflow, a CSS layout engine for node or <canvas>
    15 projects | news.ycombinator.com | 21 Mar 2024
  • Building Reddit’s Design System on iOS
    5 projects | /r/RedditEng | 27 Sep 2023
    We still wanted to leverage a layout engine that could be performant and easy-to-use. After doing some performance testing with native UIKit, Autolayout, and a few other third-party options, we ended up bringing FlexLayout into the mix, which is a Swift implementation of Facebook’s Yoga layout engine. All RPL components utilize FlexLayout in order to lay out content fast and efficiently. While we’ve enjoyed using it, we’ve found a few touch points to be mindful of. There are some rough edges we’ve found, such as utilizing stack views with subviews that use FlexLayout, that often come at odds with both UIKit and FlexLayout’s layout engines.
  • We're building a browser when it's supposed to be impossible
    13 projects | news.ycombinator.com | 11 Apr 2023
    We have our own test suite (orginally derived from the test suite of Meta's Yoga layout library [0]) which consists of text fixtures that are small HTML snippets [1] and a test harness [2] that turns those into runnable tests, utilising headless chrome both to parse the HTML and to generate the assertions based on the layout that Chrome renders (so we are effectively comparing our implementation against Chrome). We currently have 686 generated tests (covering both Flexbox and CSS Grid).

    We would like to utilise the Web Platform Test suite [3], however these are not in a standard format and many of the tests require JavaScript so we are not currently able to do that.

    [0]: https://github.com/facebook/yoga

    [1]: https://github.com/DioxusLabs/taffy/tree/main/test_fixtures

    [2]: https://github.com/DioxusLabs/taffy/tree/main/scripts/gentes...

    [3]: https://github.com/web-platform-tests/wpt/tree/master/css/cs...

  • minimax — minimalist 3D game engine in Clojure
    5 projects | /r/Clojure | 26 Feb 2023
    The "engine" is built on top of amazing https://www.lwjgl.org/ and https://github.com/bkaradzic/bgfx/, and UI system is baked by https://github.com/memononen/nanovg and https://github.com/facebook/yoga
  • Show HN: Taffy – CSS Grid (+Flexbox) as a Library
    2 projects | news.ycombinator.com | 12 Feb 2023
  • React vs React Native: How Different Are They, Really?
    12 projects | dev.to | 19 Dec 2022
    React Native uses the Yoga engine under the hood, which allows you to use CSS properties to layout your React Native UI in a way that translates really well. Layout in Yoga is limited to Flexbox and absolute/relative positioning, however; there is no CSS grid and no display attribute. This keeps things simpler and more performant, but if developers are accustomed to using other layout techniques on the web, they’ll need to adjust to this new limitation.
  • When dealing with UI, does any of you uses glViewport to layout your elements in the correct place?
    1 project | /r/gamedev | 8 Dec 2022
  • Taffy 0.2 Release: Blazing Fast UI Layout in Rust. Now with `gap`!
    3 projects | /r/rust | 24 Nov 2022
    PR #246 is super interesting to check out: by fixing the caching strategy, we were able to eliminate an exponential time (with respect to tree depth) performance penalty, and get comparable speeds for flat and deeply nested layouts (something I'd never expected to be possible). Preliminary benchmarks shows us significantly faster than yoga, Meta's C++ library for the same thing, especially on deep trees. Not too shabby for a tiny team of volunteers!
  • How To Build a CLI With Node.js and React
    7 projects | dev.to | 5 Nov 2022
    You're going to build the CLI using Ink, a React component-based library for building interactive CLIs. It uses Yoga to build Flexbox layouts in the terminal, so most CSS-like props are available in Ink as well. Ink is simply a React renderer for the terminal, so all the React features are supported. No need to learn a new syntax specific to Ink.
  • Show HN: Satori – Convert HTML and CSS to SVG in Milliseconds
    9 projects | news.ycombinator.com | 10 Oct 2022
    Interesting.

    I was thinking that this was going to be a crazy amount of layout engine work, but now I look a little closer it appears the layout work is farmed out to yoga [0] (not trying to take away anything from the effort here). So this project is almost a wrapper around running yoga as a renderer and using SVG as a form of backend target?

    I say "appears" because the yoga landing page doesn't do a great job of explaining what it does.

    [0] https://github.com/facebook/yoga

What are some alternatives?

When comparing nanovg and yoga you can also consider the following projects:

Skia - Skia is a complete 2D graphic library for drawing Text, Geometries, and Images.

react-native-skia - High-performance React Native Graphics using Skia

imgui - Dear ImGui: Bloat-free Graphical User interface for C++ with minimal dependencies

hermes - A JavaScript engine optimized for running React Native.

DiligentEngine - A modern cross-platform low-level graphics library and rendering framework

react-native-skia - Cross platform React Native solution to draw graphics based on Skia

sokol - minimal cross-platform standalone C headers

stretch - High performance flexbox implementation written in rust

MetalNanoVG - The Metal port of NanoVG.

taffy - A high performance rust-powered UI layout library

bgfx - Cross-platform, graphics API agnostic, "Bring Your Own Engine/Framework" style rendering library.

react-navigation - Routing and navigation for your React Native apps