react-native-vroom-chart 0.12.0 → 0.13.1

package/android/CMakeLists.txt

@@ -124,6 +124,14 @@ target_compile_options(vroomchart PRIVATE -Wno-mismatched-tags)
 
 find_library(VROOM_LOG_LIB log)
 
+# Android 15+ devices can use 16KB pages. NDK r27 and older default to 4KB
+# ELF alignment (align=2**12); Play/SDK 35 then rejects libvroomchart.so.
+# r28+ already aligns to 16KB, so these flags are redundant there but harmless.
+target_link_options(vroomchart PRIVATE
+    "-Wl,-z,max-page-size=16384"
+    "-Wl,-z,common-page-size=16384"
+)
+
 target_link_libraries(vroomchart
   ${VROOM_LOG_LIB}
   ReactAndroid::jsi

package/android/README.md

@@ -52,13 +52,14 @@ different, unmerged RTTI record for "the same" class and fails with
 `Expected a Skia object of a different type`.
 
 `VroomChartHostObject.cpp`'s `wrapPicture()` works around this only on
-Android: instead of constructing `RNSkia::JsiSkPicture` directly (as iOS
-does), it serializes the `SkPicture` (`SkPicture::serialize()`) and calls
-RN-Skia's own public JS API, `Skia.Picture.MakePicture(bytes)`, via JSI. That
-runs `JsiSkPictureFactory::MakePicture` — genuinely compiled inside
-`librnskia.so` — so the returned object's RTTI matches what
-`librnskia.so`'s own code expects. This costs a serialize + re-parse of the
-picture's draw commands on every `render()`/gesture call, which is real
-overhead on what's meant to be a 60fps hot path; if that shows up in
-profiling, revisit (e.g. a merged-`.so` build, or a lighter-weight bridge
-that avoids the round trip).
+Android. Two copies of Skia cannot share an `sk_sp<SkPicture>` pointer, and
+serializing the chart picture (the original workaround) embedded the Android
+system typeface on every pan/zoom frame — an OOM that killed the process after
+a few seconds of gesturing.
+
+The hot path now rasterizes the picture in vroom's Skia and hands RN-Skia raw
+pixels via `Skia.Image.MakeImage`, so `<Image>` paints a framebuffer whose size
+is bounded by the view. If rasterization fails, we still serialize, but with
+`SkTypeface::SerializeBehavior::kDontIncludeData` so the font file is not
+copied; `MakePicture` re-resolves `sans-serif` inside `librnskia.so`. iOS is
+unchanged (one binary, direct `JsiSkPicture` wrap).

package/cpp/VroomChartHostObject.cpp

@@ -4,6 +4,7 @@
 #include <string>
 #include <vector>
 
+#include "chart.h"
 #include "chart_internal.h"
 #include "vroom/vroom_chart.h"
 
@@ -11,6 +12,18 @@
 #include "JsiSkNativeObjects.h"
 #include "JsiSkPicture.h"
 
+#if defined(__ANDROID__)
+#include <algorithm>
+#include <cmath>
+
+#include "include/core/SkBitmap.h"
+#include "include/core/SkCanvas.h"
+#include "include/core/SkData.h"
+#include "include/core/SkImageInfo.h"
+#include "include/core/SkSerialProcs.h"
+#include "include/core/SkTypeface.h"
+#endif
+
 namespace vroom {
 
 namespace jsi = facebook::jsi;
@@ -74,27 +87,21 @@ std::vector<jsi::PropNameID> ChartHostObject::getPropertyNames(
 }
 
 #if defined(__ANDROID__)
-// Android only: RN-Skia is compiled into its own librnskia.so, separate from
-// libvroomchart.so. Constructing a RNSkia::JsiSkPicture directly here (as iOS
-// does, below) gives it a vtable/typeinfo from *our* .so; when RN-Skia's own
-// compiled code later consumes it (e.g. Convertor.h's
-// `getPropertyValue<sk_sp<SkPicture>>`, which does
-// `getJsiObject<JsiSkPicture>(rt, value)` — a dynamic_pointer_cast
-// under the hood), the cast fails cross-.so with "Expected a Skia object of
-// a different type", because the object's *runtime* type was never actually
-// compiled inside librnskia.so. iOS statically links everything into one
-// binary, so no such mismatch exists there.
+// Android only: RN-Skia lives in librnskia.so, vroom in libvroomchart.so, and
+// each statically links its own libskia.a. A JsiSkPicture constructed here has
+// our .so's RTTI, so RN-Skia's dynamic_pointer_cast fails with "Expected a
+// Skia object of a different type". iOS statically links one binary, so the
+// iOS wrap below can hand the sk_sp<SkPicture> through directly.
 //
-// The fix: build the picture through RN-Skia's own public JS API instead
-// (`Skia.Picture.MakePicture(bytes)`, the same call `require(...).png`-style
-// static pictures use), so the resulting JsiSkPicture is genuinely
-// constructed by librnskia.so's own code. This costs a serialize +
-// re-parse of the picture's draw ops per call — real overhead on a gesture
-// hot path — but is the only ABI-safe option found so far. Revisit if
-// profiling shows this mattering (e.g. a merged-.so build, or a lighter
-// bridge that avoids the round trip).
-#include "include/core/SkData.h"
-
+// Crossing that boundary used to serialize the chart picture and call
+// Skia.Picture.MakePicture(bytes). Default SkPicture::serialize() embeds the
+// Android system typeface (Noto-scale, megabytes) on every pan/zoom frame;
+// Hermes never kept up and the process was OOM-killed (~3 GB RSS in ~10s).
+//
+// Preferred path: rasterize in *our* Skia and hand RN-Skia raw pixels via
+// Skia.Image.MakeImage — memory is one framebuffer, labels stay correct.
+// Fallback: still serialize, but with kDontIncludeData so the font file is
+// not copied; MakePicture re-resolves sans-serif on RN-Skia's side.
 namespace {
 class SkDataMutableBuffer : public facebook::jsi::MutableBuffer {
  public:
@@ -108,41 +115,119 @@ class SkDataMutableBuffer : public facebook::jsi::MutableBuffer {
  private:
   sk_sp<SkData> data_;
 };
-}  // namespace
 
-static facebook::jsi::Value wrapPicture(facebook::jsi::Runtime& rt,
-                                       const sk_sp<SkPicture>& pic) {
-  if (!pic) return facebook::jsi::Value::null();
-  sk_sp<SkData> serialized = pic->serialize();
-  if (!serialized) return facebook::jsi::Value::null();
+jsi::Value skiaApiObject(jsi::Runtime& rt, const char* name) {
+  auto skiaApi = rt.global().getProperty(rt, "SkiaApi");
+  if (!skiaApi.isObject()) return jsi::Value::undefined();
+  auto prop = skiaApi.asObject(rt).getProperty(rt, name);
+  return prop.isObject() ? std::move(prop) : jsi::Value::undefined();
+}
 
-  auto buffer = std::make_shared<SkDataMutableBuffer>(std::move(serialized));
+// Uint8Array-shaped `{ buffer }` — MakePicture and Data.fromBytes both
+// read the ArrayBuffer off that property.
+jsi::Object bytesLike(jsi::Runtime& rt, sk_sp<SkData> data) {
+  auto buffer = std::make_shared<SkDataMutableBuffer>(std::move(data));
   jsi::ArrayBuffer arrayBuffer(rt, buffer);
+  jsi::Object arg(rt);
+  arg.setProperty(rt, "buffer", arrayBuffer);
+  return arg;
+}
 
-  auto skiaApi = rt.global().getProperty(rt, "SkiaApi");
-  if (!skiaApi.isObject()) return facebook::jsi::Value::null();
-  auto pictureFactory = skiaApi.asObject(rt).getProperty(rt, "Picture");
-  if (!pictureFactory.isObject()) return facebook::jsi::Value::null();
+sk_sp<const SkData> serializeTypefaceNoEmbed(SkTypeface* tf, void*) {
+  if (!tf) return nullptr;
+  return tf->serialize(SkTypeface::SerializeBehavior::kDontIncludeData);
+}
+
+jsi::Value wrapSerializedPicture(jsi::Runtime& rt, const sk_sp<SkPicture>& pic) {
+  SkSerialProcs procs;
+  procs.fTypefaceProc = serializeTypefaceNoEmbed;
+  sk_sp<SkData> serialized = pic->serialize(&procs);
+  if (!serialized) return jsi::Value::null();
+
+  auto pictureFactory = skiaApiObject(rt, "Picture");
+  if (pictureFactory.isUndefined()) return jsi::Value::null();
   auto pictureFactoryObj = pictureFactory.asObject(rt);
   auto makePicture =
       pictureFactoryObj.getPropertyAsFunction(rt, "MakePicture");
 
-  // Mirrors JsiSkPictureFactory::MakePicture's expected argument shape: an
-  // object with a `.buffer` property holding the ArrayBuffer (matching a
-  // Uint8Array-like value; the factory ignores everything else about it).
-  //
   // Skia 2.11's NativeState host methods recover the factory via `this`
   // (`fromThis` → "Expected PictureFactory but got non-object" if unbound).
-  jsi::Object arg(rt);
-  arg.setProperty(rt, "buffer", arrayBuffer);
-  return makePicture.callWithThis(rt, pictureFactoryObj, arg);
+  return makePicture.callWithThis(rt, pictureFactoryObj,
+                                  bytesLike(rt, std::move(serialized)));
+}
+
+jsi::Value wrapRasterImage(jsi::Runtime& rt, const sk_sp<SkPicture>& pic,
+                           float dpr) {
+  const SkRect cull = pic->cullRect();
+  const float scale = dpr > 0.f ? dpr : 1.f;
+  const int w =
+      std::max(1, static_cast<int>(std::ceil(cull.width() * scale)));
+  const int h =
+      std::max(1, static_cast<int>(std::ceil(cull.height() * scale)));
+
+  // Reused across frames on this JS thread so pan/zoom doesn't heap-allocate
+  // a new bitmap every time. Multiple charts share it; a size change reallocs.
+  thread_local SkBitmap raster;
+  const auto info = SkImageInfo::MakeN32Premul(w, h);
+  if ((raster.width() != w || raster.height() != h) &&
+      !raster.tryAllocPixels(info)) {
+    return jsi::Value::null();
+  }
+  raster.eraseColor(SK_ColorTRANSPARENT);
+  SkCanvas canvas(raster);
+  canvas.scale(scale, scale);
+  canvas.translate(-cull.left(), -cull.top());
+  canvas.drawPicture(pic);
+
+  SkPixmap pixmap;
+  if (!raster.peekPixels(&pixmap) || pixmap.addr() == nullptr) {
+    return jsi::Value::null();
+  }
+  sk_sp<SkData> pixels =
+      SkData::MakeWithCopy(pixmap.addr(), pixmap.computeByteSize());
+  if (!pixels) return jsi::Value::null();
+
+  auto dataFactory = skiaApiObject(rt, "Data");
+  auto imageFactory = skiaApiObject(rt, "Image");
+  if (dataFactory.isUndefined() || imageFactory.isUndefined()) {
+    return jsi::Value::null();
+  }
+  auto dataFactoryObj = dataFactory.asObject(rt);
+  auto imageFactoryObj = imageFactory.asObject(rt);
+  auto fromBytes = dataFactoryObj.getPropertyAsFunction(rt, "fromBytes");
+  auto makeImage = imageFactoryObj.getPropertyAsFunction(rt, "MakeImage");
+
+  auto skData =
+      fromBytes.callWithThis(rt, dataFactoryObj, bytesLike(rt, std::move(pixels)));
+  if (!skData.isObject()) return jsi::Value::null();
+
+  jsi::Object imageInfo(rt);
+  imageInfo.setProperty(rt, "width", static_cast<double>(w));
+  imageInfo.setProperty(rt, "height", static_cast<double>(h));
+  imageInfo.setProperty(rt, "colorType",
+                        static_cast<double>(pixmap.colorType()));
+  imageInfo.setProperty(rt, "alphaType",
+                        static_cast<double>(pixmap.alphaType()));
+  return makeImage.callWithThis(rt, imageFactoryObj, imageInfo, skData,
+                                static_cast<double>(pixmap.rowBytes()));
+}
+}  // namespace
+
+static facebook::jsi::Value wrapPicture(facebook::jsi::Runtime& rt,
+                                       const sk_sp<SkPicture>& pic,
+                                       float dpr = 1.f) {
+  if (!pic) return facebook::jsi::Value::null();
+  auto image = wrapRasterImage(rt, pic, dpr);
+  if (!image.isNull()) return image;
+  return wrapSerializedPicture(rt, pic);
 }
 #else
 // Shared helper: wraps a fresh picture for return to JS. Memory pressure is
 // applied inside JsiSkPicture::create (NativeObject::create reads
 // getMemoryPressure() → picture->approximateBytesUsed()).
 static facebook::jsi::Value wrapPicture(facebook::jsi::Runtime& rt,
-                                       const sk_sp<SkPicture>& pic) {
+                                       const sk_sp<SkPicture>& pic,
+                                       float /*dpr*/ = 1.f) {
   if (!pic) return facebook::jsi::Value::null();
   auto host =
       std::make_shared<RNSkia::JsiSkPicture>(/*context=*/nullptr, pic);
@@ -448,7 +533,8 @@ jsi::Value ChartHostObject::get(jsi::Runtime& rt,
           const float dx = static_cast<float>(args[0].asNumber());
           const float dy = static_cast<float>(args[1].asNumber());
           vroom_chart_pan(chart_, dx, dy);
-          return wrapPicture(rt2, render_chart_picture(chart_));
+          return wrapPicture(rt2, render_chart_picture(chart_),
+                         chart_->px_ratio);
         });
   }
 
@@ -467,7 +553,8 @@ jsi::Value ChartHostObject::get(jsi::Runtime& rt,
           const float dx = static_cast<float>(args[0].asNumber());
           const float dy = static_cast<float>(args[1].asNumber());
           vroom_chart_translate(chart_, dx, dy);
-          return wrapPicture(rt2, render_chart_picture(chart_));
+          return wrapPicture(rt2, render_chart_picture(chart_),
+                         chart_->px_ratio);
         });
   }
 
@@ -489,7 +576,8 @@ jsi::Value ChartHostObject::get(jsi::Runtime& rt,
           const float fx = static_cast<float>(args[2].asNumber());
           const float fy = static_cast<float>(args[3].asNumber());
           vroom_chart_zoom(chart_, sx, sy, fx, fy);
-          return wrapPicture(rt2, render_chart_picture(chart_));
+          return wrapPicture(rt2, render_chart_picture(chart_),
+                         chart_->px_ratio);
         });
   }
 
@@ -505,7 +593,8 @@ jsi::Value ChartHostObject::get(jsi::Runtime& rt,
           if (count < 1) return jsi::Value::null();
           const float dy = static_cast<float>(args[0].asNumber());
           vroom_chart_scale_price_axis(chart_, dy);
-          return wrapPicture(rt2, render_chart_picture(chart_));
+          return wrapPicture(rt2, render_chart_picture(chart_),
+                         chart_->px_ratio);
         });
   }
 
@@ -521,7 +610,8 @@ jsi::Value ChartHostObject::get(jsi::Runtime& rt,
           if (count < 1) return jsi::Value::null();
           const float dx = static_cast<float>(args[0].asNumber());
           vroom_chart_scale_time_axis(chart_, dx);
-          return wrapPicture(rt2, render_chart_picture(chart_));
+          return wrapPicture(rt2, render_chart_picture(chart_),
+                         chart_->px_ratio);
         });
   }
 
@@ -572,7 +662,8 @@ jsi::Value ChartHostObject::get(jsi::Runtime& rt,
           const float x = static_cast<float>(args[0].asNumber());
           const float y = static_cast<float>(args[1].asNumber());
           vroom_chart_set_crosshair(chart_, x, y);
-          return wrapPicture(rt2, render_chart_picture(chart_));
+          return wrapPicture(rt2, render_chart_picture(chart_),
+                         chart_->px_ratio);
         });
   }
 
@@ -587,7 +678,8 @@ jsi::Value ChartHostObject::get(jsi::Runtime& rt,
                const jsi::Value* /*args*/,
                size_t /*count*/) -> jsi::Value {
           vroom_chart_clear_crosshair(chart_);
-          return wrapPicture(rt2, render_chart_picture(chart_));
+          return wrapPicture(rt2, render_chart_picture(chart_),
+                         chart_->px_ratio);
         });
   }
 
@@ -1098,7 +1190,8 @@ jsi::Value ChartHostObject::get(jsi::Runtime& rt,
                const jsi::Value& /*thisVal*/,
                const jsi::Value* /*args*/,
                size_t /*count*/) -> jsi::Value {
-          return wrapPicture(rt2, render_chart_picture(chart_));
+          return wrapPicture(rt2, render_chart_picture(chart_),
+                         chart_->px_ratio);
         });
   }
 

package/cpp/VroomChartHostObject.h

@@ -6,7 +6,7 @@
 // Methods exposed to JS:
 //   setCandles(arrayBuffer)   — copies packed VroomCandle[] into the core
 //   setSize(width, height, pxRatio)
-//   render() -> JsiSkPicture  — returns the current chart picture
+//   render() -> SkPicture (iOS) / SkImage (Android)
 
 #pragma once
 

package/cpp/VroomJsiInstaller.cpp

@@ -5,7 +5,7 @@
 //     methods on the returned object:
 //       setCandles(arrayBuffer)
 //       setSize(w, h, pxRatio)
-//       render() -> JsiSkPicture
+//       render() -> SkPicture (iOS) / SkImage (Android)
 //
 // The host object's lifetime is managed by JS GC — when the React component
 // drops its reference, the underlying VroomChart is destroyed.

package/cpp/_core_src/price_format.cpp

@@ -2,6 +2,7 @@
 
 #include <algorithm>
 #include <cmath>
+#include <cstddef>
 #include <cstdio>
 
 namespace vroom {
@@ -15,6 +16,38 @@ constexpr size_t kPlainCap = 340;
 constexpr char kGroupSeparator = ',';
 constexpr int kGroupSize = 3;
 
+constexpr double kMillion = 1e6;
+constexpr double kBillion = 1e9;
+constexpr double kTrillion = 1e12;
+
+double compact_divisor(CompactScale scale) {
+    switch (scale) {
+        case CompactScale::Million:  return kMillion;
+        case CompactScale::Billion:  return kBillion;
+        case CompactScale::Trillion: return kTrillion;
+        case CompactScale::None:     return 1.0;
+    }
+    return 1.0;
+}
+
+char compact_suffix(CompactScale scale) {
+    switch (scale) {
+        case CompactScale::Million:  return 'M';
+        case CompactScale::Billion:  return 'B';
+        case CompactScale::Trillion: return 'T';
+        case CompactScale::None:     return '\0';
+    }
+    return '\0';
+}
+
+CompactScale compact_scale_for(double reference) {
+    const double r = std::fabs(reference);
+    if (!std::isfinite(r) || r < kMillion) return CompactScale::None;
+    if (r >= kTrillion) return CompactScale::Trillion;
+    if (r >= kBillion) return CompactScale::Billion;
+    return CompactScale::Million;
+}
+
 }  // namespace
 
 int significant_decimals(double reference) {
@@ -28,7 +61,8 @@ int significant_decimals(double reference) {
 }
 
 PriceFormat price_format_for(double reference) {
-    return PriceFormat{significant_decimals(reference), true};
+    return PriceFormat{significant_decimals(reference), true,
+                       compact_scale_for(reference)};
 }
 
 int price_decimals(double interval) {
@@ -40,8 +74,13 @@ int price_decimals(double interval) {
 }
 
 PriceFormat with_tick_guard(const PriceFormat& fmt, double interval) {
-    return PriceFormat{std::max(fmt.decimals, price_decimals(interval)),
-                       fmt.group};
+    const double divisor = compact_divisor(fmt.compact);
+    const double display_interval =
+        (divisor != 1.0 && interval > 0.0 && std::isfinite(interval))
+            ? interval / divisor
+            : interval;
+    return PriceFormat{std::max(fmt.decimals, price_decimals(display_interval)),
+                       fmt.group, fmt.compact};
 }
 
 void format_price(char* buf, size_t buf_size, double price,
@@ -49,11 +88,23 @@ void format_price(char* buf, size_t buf_size, double price,
     if (!buf || buf_size == 0) return;
     const int decimals = std::clamp(fmt.decimals, 0, kPriceMaxDecimals);
 
+    const double divisor = compact_divisor(fmt.compact);
+    const double display = (divisor != 1.0) ? price / divisor : price;
+
     char plain[kPlainCap];
-    if (std::snprintf(plain, sizeof(plain), "%.*f", decimals, price) < 0) {
+    if (std::snprintf(plain, sizeof(plain), "%.*f", decimals, display) < 0) {
         buf[0] = '\0';
         return;
     }
+
+    const char suffix = compact_suffix(fmt.compact);
+    if (suffix != '\0') {
+        // Compact form is already short; grouping would only fire if a tick
+        // wandered across a suffix boundary (1000.00M). Skip it.
+        std::snprintf(buf, buf_size, "%s%c", plain, suffix);
+        return;
+    }
+
     if (!fmt.group) {
         std::snprintf(buf, buf_size, "%s", plain);
         return;

package/cpp/_core_src/price_format.h

@@ -13,6 +13,16 @@
 //   0.023397  -> 6 decimals   0.023397
 //   80285.20  -> 2 decimals   80,285.20   (floor)
 //   2513.92   -> 2 decimals   2,513.92    (floor)
+//   1.59e6    -> compact      1.59M
+//   3.219e7   -> compact      32.19M
+//   3.454e10  -> compact      34.54B
+//   1.2e12    -> compact      1.20T
+//
+// Past a million the integer digits eat the axis, so the format switches to a
+// suffix (M / B / T) with two decimal places. The suffix is keyed off the
+// asset's own price, not each tick, so every label on a market-cap chart
+// shares a column and a zoomed-in 32.1M–32.2M range does not mix "32.15M"
+// with "32,150,000.00".
 //
 // The reference is the asset's own price, not the visible range, so the
 // precision holds steady while the user pans and zooms. A range-derived count
@@ -32,18 +42,31 @@ namespace vroom {
 inline constexpr int kPriceSigDigits = 5;
 
 // Prices at or above ~1 unit read as currency, where fewer than two decimals
-// looks broken (a "$84,000" axis next to a "$80,285.20" last price).
+// looks broken (a "$84,000" axis next to a "$80,285.20" last price). Compact
+// suffixes use the same floor: "32.19M", not "32.2M".
 inline constexpr int kPriceMinDecimals = 2;
 
 // Past this the digits are noise, and %.*f starts printing the binary
 // representation's tail rather than anything the feed meant.
 inline constexpr int kPriceMaxDecimals = 12;
 
+// Compact suffix for assets priced in the millions and up. Keyed off the
+// reference, then applied to every label so the column stays uniform. Nothing
+// below a million is abbreviated — no K.
+enum class CompactScale {
+    None,
+    Million,    // |ref| >= 1e6
+    Billion,    // |ref| >= 1e9
+    Trillion,   // |ref| >= 1e12
+};
+
 // How to render a price. `group` inserts thousands separators, which only ever
-// affects the integer part.
+// affects the integer part of a non-compact format. `compact` scales the value
+// and appends M / B / T; grouping is skipped in that path.
 struct PriceFormat {
-    int  decimals = kPriceMinDecimals;
-    bool group = true;
+    int          decimals = kPriceMinDecimals;
+    bool         group = true;
+    CompactScale compact = CompactScale::None;
 };
 
 // Decimals giving kPriceSigDigits significant digits for an asset priced around
@@ -51,7 +74,8 @@ struct PriceFormat {
 // non-finite reference falls back to the floor.
 int significant_decimals(double reference);
 
-// The format for an asset priced around `reference`.
+// The format for an asset priced around `reference`, including the compact
+// suffix when |reference| is at least a million.
 PriceFormat price_format_for(double reference);
 
 // Decimal places needed so adjacent ticks `interval` apart don't collapse to
@@ -60,6 +84,9 @@ int price_decimals(double interval);
 
 // `fmt` raised, if need be, so ticks `interval` apart stay distinct. The asset's
 // precision is the floor; only a zoom deeper than that precision adds to it.
+// `interval` is in the data's units; when `fmt` is compact the guard converts
+// it into display units (interval / 1e6 for millions, etc.) so a 1,000-wide
+// step on a 32M chart still gets enough decimals to print as 32.192M vs 32.193M.
 PriceFormat with_tick_guard(const PriceFormat& fmt, double interval);
 
 // Writes `price` into `buf` per `fmt`, truncating rather than overrunning.