react-native-nano-icons 0.1.3 → 0.1.4

package/ios/NanoIconView.mm

@@ -1,5 +1,4 @@
 #import "NanoIconView.h"
-
 #import <CoreText/CoreText.h>
 #import <React/RCTConversions.h>
 #import <React/RCTFabricComponentsPlugins.h>
@@ -8,239 +7,280 @@
 
 using namespace facebook::react;
 
+// Drawing canvas that can be shifted outside the Yoga frame.
+@interface NanoIconDrawingView : UIView
+@property (nonatomic, copy) void (^drawBlock)(CGContextRef, CGRect);
+@end
+
+@implementation NanoIconDrawingView
+- (instancetype)initWithFrame:(CGRect)frame {
+    if (self = [super initWithFrame:frame]) {
+        self.opaque = NO;
+        self.backgroundColor = [UIColor clearColor];
+        self.userInteractionEnabled = NO;
+    }
+    return self;
+}
+- (void)drawRect:(CGRect)rect {
+    if (self.drawBlock) {
+        CGContextRef ctx = UIGraphicsGetCurrentContext();
+        if (ctx) self.drawBlock(ctx, self.bounds);
+    }
+}
+@end
+
 @implementation NanoIconView {
   CTFontRef _font;
   NSString *_fontFamily;
   CGFloat _fontSize;
   std::vector<CGGlyph> _glyphs;
   std::vector<uint32_t> _colors;
-  // Cached CGColor refs — rebuilt only when colors prop changes
   std::vector<CGColorRef> _cachedCGColors;
-  // Cached layout metrics — rebuilt only when font or bounds change
   CGFloat _fitScale;
   CGPoint _baselinePosition;
   BOOL _metricsValid;
+  NanoIconDrawingView *_drawingView;
 }
 
-- (instancetype)initWithFrame:(CGRect)frame
-{
+- (instancetype)initWithFrame:(CGRect)frame {
   if (self = [super initWithFrame:frame]) {
     static const auto defaultProps = std::make_shared<const NanoIconViewProps>();
     _props = defaultProps;
     self.opaque = NO;
     self.backgroundColor = [UIColor clearColor];
+    self.clipsToBounds = NO;
+
     _fitScale = 1.0;
     _baselinePosition = CGPointZero;
-    _metricsValid = NO;
+
+    _drawingView = [[NanoIconDrawingView alloc] initWithFrame:self.bounds];
+    __weak __typeof(self) weakSelf = self;
+    _drawingView.drawBlock = ^(CGContextRef context, CGRect bounds) {
+      [weakSelf _drawIconInContext:context bounds:bounds];
+    };
+    [self addSubview:_drawingView];
   }
   return self;
 }
 
-+ (ComponentDescriptorProvider)componentDescriptorProvider
-{
++ (ComponentDescriptorProvider)componentDescriptorProvider {
   return concreteComponentDescriptorProvider<NanoIconViewComponentDescriptor>();
 }
 
-- (void)_releaseCachedColors
-{
-  for (CGColorRef c : _cachedCGColors) {
-    CGColorRelease(c);
-  }
-  _cachedCGColors.clear();
-}
+- (void)updateClippedSubviewsWithClipRect:(__unused CGRect)clipRect
+                           relativeToView:(__unused UIView *)clipView {}
 
-- (void)_rebuildCachedColors
-{
-  [self _releaseCachedColors];
-  _cachedCGColors.resize(_colors.size());
-  for (size_t i = 0; i < _colors.size(); i++) {
-    uint32_t colorInt = _colors[i];
-    CGFloat a = ((colorInt >> 24) & 0xFF) / 255.0;
-    CGFloat r = ((colorInt >> 16) & 0xFF) / 255.0;
-    CGFloat g = ((colorInt >> 8) & 0xFF) / 255.0;
-    CGFloat b = (colorInt & 0xFF) / 255.0;
-    _cachedCGColors[i] = CGColorCreateSRGB(r, g, b, a);
-  }
-}
+#pragma mark - Metrics
 
-- (void)_updateMetrics
-{
+// Scale factor to fit the icon font's em square into the view height,
+// and the CoreText baseline origin used for all glyph draws.
+- (void)_updateMetrics {
   if (!_font) {
     _metricsValid = NO;
     return;
   }
-
   CGFloat ascent = CTFontGetAscent(_font);
   CGFloat descent = CTFontGetDescent(_font);
-  CGFloat fontTotalHeight = ascent + descent;
-  CGFloat viewHeight = self.bounds.size.height;
-
-  _fitScale = (fontTotalHeight > 0) ? (viewHeight / fontTotalHeight) : 1.0;
+  CGFloat totalHeight = ascent + descent;
+  _fitScale = (totalHeight > 0) ? (self.bounds.size.height / totalHeight) : 1.0;
   _baselinePosition = CGPointMake(0, descent);
   _metricsValid = YES;
 }
 
-- (void)updateProps:(const Props::Shared &)props oldProps:(const Props::Shared &)oldProps
-{
-  const auto &oldViewProps = static_cast<const NanoIconViewProps &>(*_props);
-  const auto &newViewProps = static_cast<const NanoIconViewProps &>(*props);
-
-  // Recreate font if fontFamily or fontSize changed
-  BOOL fontChanged = NO;
-  if (oldViewProps.fontFamily != newViewProps.fontFamily || oldViewProps.fontSize != newViewProps.fontSize) {
-    if (_font) {
-      CFRelease(_font);
-      _font = NULL;
+// Distance from this view's bottom edge to the parent text baseline.
+// Returns 0 when standalone or when the icon is taller than the text line.
+- (CGFloat)_inlineBaselineOffset {
+  UIView *current = self.superview;
+  NSAttributedString *attrStr = nil;
+  while (current) {
+    if ([current respondsToSelector:@selector(attributedText)]) {
+      attrStr = [current performSelector:@selector(attributedText)];
+      if (attrStr.length > 0) break;
     }
-    NSString *family = [NSString stringWithUTF8String:newViewProps.fontFamily.c_str()];
-    _fontFamily = family;
-    _fontSize = newViewProps.fontSize;
-    _font = CTFontCreateWithName((__bridge CFStringRef)family, _fontSize, NULL);
-    fontChanged = YES;
-    _metricsValid = NO;
+    current = current.superview;
   }
+  if (!attrStr) return 0;
 
-  // Update glyphs if codepoints changed or font changed
-  BOOL codepointsChanged = fontChanged || (oldViewProps.codepoints != newViewProps.codepoints);
-  if (codepointsChanged && _font) {
-    const auto &codepoints = newViewProps.codepoints;
-    _glyphs.resize(codepoints.size());
+  UIFont *f = [attrStr attribute:NSFontAttributeName atIndex:0 effectiveRange:nil];
+  if (!f) return 0;
 
-    for (size_t i = 0; i < codepoints.size(); i++) {
-      int32_t cp = codepoints[i];
-      // Handle BMP and supplementary plane characters
-      if (cp <= 0xFFFF) {
-        UniChar ch = (UniChar)cp;
-        CTFontGetGlyphsForCharacters(_font, &ch, &_glyphs[i], 1);
-      } else {
-        // Supplementary plane (private use area): use surrogate pair
-        UniChar surrogates[2];
-        surrogates[0] = (UniChar)(0xD800 + ((cp - 0x10000) >> 10));
-        surrogates[1] = (UniChar)(0xDC00 + ((cp - 0x10000) & 0x3FF));
-        CGGlyph glyphPair[2] = {0, 0};
-        CTFontGetGlyphsForCharacters(_font, surrogates, glyphPair, 2);
-        _glyphs[i] = glyphPair[0];
-      }
-    }
-  }
+  NSParagraphStyle *style = [attrStr attribute:NSParagraphStyleAttributeName
+                                       atIndex:0 effectiveRange:nil];
+  CGFloat lineHeight = (style && style.maximumLineHeight > 0)
+                     ? style.maximumLineHeight : f.lineHeight;
 
-  // Update colors
-  if (oldViewProps.colors != newViewProps.colors) {
-    const auto &colors = newViewProps.colors;
-    _colors.resize(colors.size());
-    for (size_t i = 0; i < colors.size(); i++) {
-      _colors[i] = (uint32_t)colors[i];
-    }
-    [self _rebuildCachedColors];
-  }
+  NSNumber *bOff = [attrStr attribute:NSBaselineOffsetAttributeName
+                              atIndex:0 effectiveRange:nil];
+  CGFloat baselineFromLineTop = f.ascender - (bOff ? bOff.doubleValue : 0);
 
-  [super updateProps:props oldProps:oldProps];
-  [self setNeedsDisplay];
+  CGFloat frameBottom = self.frame.origin.y + self.frame.size.height;
+  CGFloat posInLine = fmod(frameBottom, lineHeight);
+  if (posInLine < 0.01) posInLine = lineHeight;
+
+  return MAX(0, posInLine - baselineFromLineTop);
 }
 
-- (void)layoutSubviews
-{
+#pragma mark - Layout
+
+- (void)layoutSubviews {
   [super layoutSubviews];
-  _metricsValid = NO;
-}
+  if (!_metricsValid) [self _updateMetrics];
 
-- (void)drawRect:(CGRect)rect
-{
-  if (!_font || _glyphs.empty()) {
-    return;
-  }
+  CGFloat offset = [self _inlineBaselineOffset];
+  _drawingView.frame = CGRectMake(0, -offset,
+                                  self.bounds.size.width, self.bounds.size.height);
+}
 
-  CGContextRef context = UIGraphicsGetCurrentContext();
-  if (!context) {
-    return;
-  }
+#pragma mark - Drawing
 
-  if (!_metricsValid) {
-    [self _updateMetrics];
-  }
+// Render multi-color icons by drawing each color layer glyph at the same
+// position. Layers stack via painter's order to compose the final icon.
+- (void)_drawIconInContext:(CGContextRef)context bounds:(CGRect)bounds {
+  if (!_font || _glyphs.empty()) return;
+  if (!_metricsValid) [self _updateMetrics];
 
   CGContextSaveGState(context);
-  // CoreText draws with y-axis pointing up; UIKit has y-axis pointing down.
-  CGContextTranslateCTM(context, 0, self.bounds.size.height);
+  // Flip to CoreText coordinates (Y-up) and apply fit scale.
+  CGContextTranslateCTM(context, 0, bounds.size.height);
   CGContextScaleCTM(context, 1.0, -1.0);
   CGContextScaleCTM(context, _fitScale, _fitScale);
 
-  // Batch consecutive same-color glyphs into a single CTFontDrawGlyphs call
   size_t i = 0;
   while (i < _glyphs.size()) {
-    if (_glyphs[i] == 0) {
-      i++;
-      continue;
-    }
+    if (_glyphs[i] == 0) { i++; continue; }
 
-    // Determine the color for this run
     CGColorRef color = (i < _cachedCGColors.size()) ? _cachedCGColors[i] : NULL;
     if (!color) {
-      // Fallback: opaque black
       static CGColorRef sBlack = CGColorCreateSRGB(0, 0, 0, 1);
       color = sBlack;
     }
     CGContextSetFillColorWithColor(context, color);
 
-    // Collect consecutive glyphs with the same color
+    // Batch consecutive same-color glyphs.
     size_t batchStart = i;
     size_t batchCount = 0;
-    // Use a small stack buffer for positions; heap-allocate only for very large batches
-    CGPoint positionsBuf[16];
-    CGGlyph glyphsBuf[16];
-    CGPoint *positions = positionsBuf;
-    CGGlyph *batchGlyphs = glyphsBuf;
+    CGPoint posBuf[16];
+    CGGlyph glyphBuf[16];
 
     while (i < _glyphs.size()) {
       if (_glyphs[i] == 0) { i++; continue; }
-
-      CGColorRef nextColor = (i < _cachedCGColors.size()) ? _cachedCGColors[i] : NULL;
-      // Break batch if color changes
-      if (i > batchStart && nextColor != color) break;
-
+      CGColorRef next = (i < _cachedCGColors.size()) ? _cachedCGColors[i] : NULL;
+      if (i > batchStart && next != color) break;
       if (batchCount < 16) {
-        positions[batchCount] = _baselinePosition;
-        batchGlyphs[batchCount] = _glyphs[i];
+        posBuf[batchCount] = _baselinePosition;
+        glyphBuf[batchCount] = _glyphs[i];
       }
       batchCount++;
       i++;
     }
 
-    // If batch exceeded stack buffer, allocate and refill
+    CGPoint *positions = posBuf;
+    CGGlyph *glyphs = glyphBuf;
     if (batchCount > 16) {
       positions = (CGPoint *)malloc(batchCount * sizeof(CGPoint));
-      batchGlyphs = (CGGlyph *)malloc(batchCount * sizeof(CGGlyph));
+      glyphs = (CGGlyph *)malloc(batchCount * sizeof(CGGlyph));
       size_t idx = 0;
       for (size_t j = batchStart; j < i; j++) {
         if (_glyphs[j] == 0) continue;
         positions[idx] = _baselinePosition;
-        batchGlyphs[idx] = _glyphs[j];
+        glyphs[idx] = _glyphs[j];
         idx++;
       }
     }
 
-    CTFontDrawGlyphs(_font, batchGlyphs, positions, batchCount, context);
+    CTFontDrawGlyphs(_font, glyphs, positions, batchCount, context);
 
     if (batchCount > 16) {
       free(positions);
-      free(batchGlyphs);
+      free(glyphs);
     }
   }
 
   CGContextRestoreGState(context);
 }
 
-- (void)dealloc
-{
-  if (_font) {
-    CFRelease(_font);
+#pragma mark - Props
+
+- (void)_releaseCachedColors {
+  for (CGColorRef c : _cachedCGColors) CGColorRelease(c);
+  _cachedCGColors.clear();
+}
+
+// Convert ARGB uint32 color values into cached CGColorRefs.
+- (void)_rebuildCachedColors {
+  [self _releaseCachedColors];
+  _cachedCGColors.resize(_colors.size());
+  for (size_t i = 0; i < _colors.size(); i++) {
+    uint32_t ci = _colors[i];
+    _cachedCGColors[i] = CGColorCreateSRGB(
+        ((ci >> 16) & 0xFF) / 255.0,
+        ((ci >> 8)  & 0xFF) / 255.0,
+        ( ci        & 0xFF) / 255.0,
+        ((ci >> 24) & 0xFF) / 255.0);
+  }
+}
+
+- (void)updateProps:(const Props::Shared &)props oldProps:(const Props::Shared &)oldProps {
+  const auto &oldViewProps = static_cast<const NanoIconViewProps &>(*_props);
+  const auto &newViewProps = static_cast<const NanoIconViewProps &>(*props);
+
+  BOOL fontChanged = NO;
+  BOOL needsRedraw = NO;
+
+  if (oldViewProps.fontFamily != newViewProps.fontFamily ||
+      oldViewProps.fontSize  != newViewProps.fontSize) {
+    if (_font) { CFRelease(_font); _font = NULL; }
+    _fontFamily = [NSString stringWithUTF8String:newViewProps.fontFamily.c_str()];
+    _fontSize = newViewProps.fontSize;
+    _font = CTFontCreateWithName((__bridge CFStringRef)_fontFamily, _fontSize, NULL);
+    _metricsValid = NO;
+    fontChanged = YES;
+    needsRedraw = YES;
+  }
+
+  // Map Unicode codepoints to font glyph IDs, handling surrogate pairs for codepoints > 0xFFFF.
+  if (fontChanged || oldViewProps.codepoints != newViewProps.codepoints) {
+    const auto &codepoints = newViewProps.codepoints;
+    _glyphs.resize(codepoints.size());
+    for (size_t i = 0; i < codepoints.size(); i++) {
+      int32_t cp = codepoints[i];
+      if (cp <= 0xFFFF) {
+        UniChar ch = (UniChar)cp;
+        CTFontGetGlyphsForCharacters(_font, &ch, &_glyphs[i], 1);
+      } else {
+        UniChar surr[2] = {
+          (UniChar)(0xD800 + ((cp - 0x10000) >> 10)),
+          (UniChar)(0xDC00 + ((cp - 0x10000) & 0x3FF))
+        };
+        CGGlyph pair[2] = {0, 0};
+        CTFontGetGlyphsForCharacters(_font, surr, pair, 2);
+        _glyphs[i] = pair[0];
+      }
+    }
+    needsRedraw = YES;
+  }
+
+  if (oldViewProps.colors != newViewProps.colors) {
+    const auto &colors = newViewProps.colors;
+    _colors.resize(colors.size());
+    for (size_t i = 0; i < colors.size(); i++) {
+      _colors[i] = (uint32_t)colors[i];
+    }
+    [self _rebuildCachedColors];
+    needsRedraw = YES;
   }
+
+  [super updateProps:props oldProps:oldProps];
+  if (needsRedraw) [_drawingView setNeedsDisplay];
+}
+
+- (void)dealloc {
+  if (_font) CFRelease(_font);
   [self _releaseCachedColors];
 }
 
 @end
 
-Class<RCTComponentViewProtocol> NanoIconViewCls(void)
-{
+Class<RCTComponentViewProtocol> NanoIconViewCls(void) {
   return NanoIconView.class;
 }

package/lib/module/createNanoIconsSet.native.js

@@ -9,6 +9,18 @@ import { jsx as _jsx } from "react/jsx-runtime";
 export { shallowEqualColor };
 const DEFAULT_ICON_SIZE = 12;
 const HAS_NATIVE_IMPL = UIManager.hasViewManagerConfig('NanoIconView');
+
+// Shared processColor cache — avoids redundant color parsing for repeated
+// color strings like "black", "rgba(0,0,0,0.3)" across thousands of icons
+const processedColorCache = new Map();
+function cachedProcessColor(color) {
+  let result = processedColorCache.get(color);
+  if (result === undefined) {
+    result = processColor(color) ?? 0xff000000;
+    processedColorCache.set(color, result);
+  }
+  return result;
+}
 export function createIconSet(glyphMap) {
   if (!HAS_NATIVE_IMPL) {
     return createJSIconSet(glyphMap);
@@ -18,6 +30,27 @@ export function createIconSet(glyphMap) {
   const resolveEntry = name => {
     return glyphMap.i[name] ?? [unitsPerEm, [[63, 'black']]];
   };
+
+  // Pre-compute per-icon static data (codepoints, default colors) once at set creation
+  // Avoids layers.map() + processColor per icon mount
+  const codepointsCache = new Map();
+  const defaultColorsCache = new Map();
+  function getCodepoints(name, layers) {
+    let cp = codepointsCache.get(name);
+    if (!cp) {
+      cp = layers.map(([c]) => c);
+      codepointsCache.set(name, cp);
+    }
+    return cp;
+  }
+  function getDefaultColors(name, layers) {
+    let colors = defaultColorsCache.get(name);
+    if (!colors) {
+      colors = layers.map(([, srcColor]) => cachedProcessColor(srcColor ?? 'black'));
+      defaultColorsCache.set(name, colors);
+    }
+    return colors;
+  }
   const Icon = /*#__PURE__*/memo(({
     name,
     size = DEFAULT_ICON_SIZE,
@@ -34,13 +67,20 @@ export function createIconSet(glyphMap) {
     const [adv, layers] = resolveEntry(name);
     const scaledSize = size * fontScale;
     const width = adv / unitsPerEm * scaledSize;
-    const colorArray = Array.isArray(color) ? color : [color];
-    const lastPaletteColor = colorArray?.length ? colorArray[colorArray.length - 1] : undefined;
-    const codepoints = useMemo(() => layers.map(([cp]) => cp), [name]);
-    const processedColors = useMemo(() => layers.map(([, srcColor], i) => {
-      const layerColor = colorArray?.[i] ?? lastPaletteColor ?? srcColor ?? 'black';
-      return processColor(layerColor) ?? 0xff000000;
-    }), [name, color]);
+    const nameStr = name;
+    const codepoints = getCodepoints(nameStr, layers);
+    const processedColors = useMemo(() => {
+      // Fast path: no custom color — use pre-computed defaults
+      if (color === undefined || color === null) {
+        return getDefaultColors(nameStr, layers);
+      }
+      const colorArray = Array.isArray(color) ? color : [color];
+      const lastPaletteColor = colorArray.length ? colorArray[colorArray.length - 1] : undefined;
+      return layers.map(([, srcColor], i) => {
+        const layerColor = colorArray[i] ?? lastPaletteColor ?? srcColor ?? 'black';
+        return cachedProcessColor(layerColor);
+      });
+    }, [nameStr, color]);
     const nativeStyle = useMemo(() => [{
       width,
       height: scaledSize

package/lib/module/createNanoIconsSet.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["memo","useMemo","PixelRatio","UIManager","processColor","shallowEqualColor","NanoIconViewNative","createJSIconSet","jsx","_jsx","DEFAULT_ICON_SIZE","HAS_NATIVE_IMPL","hasViewManagerConfig","createIconSet","glyphMap","fontFamilyBasename","m","f","unitsPerEm","u","resolveEntry","name","i","Icon","size","color","style","allowFontScaling","accessible","accessibilityLabel","accessibilityRole","testID","ref","fontScale","getFontScale","adv","layers","scaledSize","width","colorArray","Array","isArray","lastPaletteColor","length","undefined","codepoints","map","cp","processedColors","srcColor","layerColor","nativeStyle","height","fontFamily","colors","fontSize","advanceWidth","iconWidth","iconHeight","prev","next","displayName"],"sourceRoot":"../../src","sources":["createNanoIconsSet.native.tsx"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["memo","useMemo","PixelRatio","UIManager","processColor","shallowEqualColor","NanoIconViewNative","createJSIconSet","jsx","_jsx","DEFAULT_ICON_SIZE","HAS_NATIVE_IMPL","hasViewManagerConfig","processedColorCache","Map","cachedProcessColor","color","result","get","undefined","set","createIconSet","glyphMap","fontFamilyBasename","m","f","unitsPerEm","u","resolveEntry","name","i","codepointsCache","defaultColorsCache","getCodepoints","layers","cp","map","c","getDefaultColors","colors","srcColor","Icon","size","style","allowFontScaling","accessible","accessibilityLabel","accessibilityRole","testID","ref","fontScale","getFontScale","adv","scaledSize","width","nameStr","codepoints","processedColors","colorArray","Array","isArray","lastPaletteColor","length","layerColor","nativeStyle","height","fontFamily","fontSize","advanceWidth","iconWidth","iconHeight","prev","next","displayName"],"sourceRoot":"../../src","sources":["createNanoIconsSet.native.tsx"],"mappings":"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","ignoreList":[]}

package/lib/typescript/src/createNanoIconsSet.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createNanoIconsSet.native.d.ts","sourceRoot":"","sources":["../../../src/createNanoIconsSet.native.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAc,MAAM,cAAc,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACxD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAI9D,YAAY,EAAE,aAAa,EAAE,SAAS,EAAE,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAM7B,wBAAgB,aAAa,CAAC,EAAE,SAAS,iBAAiB,EACxD,QAAQ,EAAE,EAAE,GACX,aAAa,CAAC,EAAE,CAAC,CA0FnB"}
+{"version":3,"file":"createNanoIconsSet.native.d.ts","sourceRoot":"","sources":["../../../src/createNanoIconsSet.native.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAc,MAAM,cAAc,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AACxD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAI9D,YAAY,EAAE,aAAa,EAAE,SAAS,EAAE,CAAC;AACzC,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAkB7B,wBAAgB,aAAa,CAAC,EAAE,SAAS,iBAAiB,EACxD,QAAQ,EAAE,EAAE,GACX,aAAa,CAAC,EAAE,CAAC,CA8GnB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-nano-icons",
-  "version": "0.1.3",
+  "version": "0.1.4",
   "description": "Use any svg as font. High-performance, build-time icon font generation and rendering for React Native & Expo.",
   "react-native": "src/index.ts",
   "source": "src/index.ts",

package/src/createNanoIconsSet.native.tsx

@@ -13,6 +13,18 @@ const DEFAULT_ICON_SIZE = 12;
 
 const HAS_NATIVE_IMPL = UIManager.hasViewManagerConfig('NanoIconView');
 
+// Shared processColor cache — avoids redundant color parsing for repeated
+// color strings like "black", "rgba(0,0,0,0.3)" across thousands of icons
+const processedColorCache = new Map<string, number>();
+function cachedProcessColor(color: string): number {
+  let result = processedColorCache.get(color);
+  if (result === undefined) {
+    result = (processColor(color) ?? 0xff000000) as number;
+    processedColorCache.set(color, result);
+  }
+  return result;
+}
+
 export function createIconSet<GM extends NanoGlyphMapInput>(
   glyphMap: GM
 ): IconComponent<GM> {
@@ -30,6 +42,29 @@ export function createIconSet<GM extends NanoGlyphMapInput>(
     ]) as GlyphEntry;
   };
 
+  // Pre-compute per-icon static data (codepoints, default colors) once at set creation
+  // Avoids layers.map() + processColor per icon mount
+  const codepointsCache = new Map<string, readonly number[]>();
+  const defaultColorsCache = new Map<string, readonly number[]>();
+
+  function getCodepoints(name: string, layers: GlyphEntry[1]): readonly number[] {
+    let cp = codepointsCache.get(name);
+    if (!cp) {
+      cp = layers.map(([c]) => c);
+      codepointsCache.set(name, cp);
+    }
+    return cp;
+  }
+
+  function getDefaultColors(name: string, layers: GlyphEntry[1]): readonly number[] {
+    let colors = defaultColorsCache.get(name);
+    if (!colors) {
+      colors = layers.map(([, srcColor]) => cachedProcessColor(srcColor ?? 'black'));
+      defaultColorsCache.set(name, colors);
+    }
+    return colors;
+  }
+
   const Icon = memo(
     ({
       name,
@@ -48,27 +83,24 @@ export function createIconSet<GM extends NanoGlyphMapInput>(
       const scaledSize = size * fontScale;
       const width = (adv / unitsPerEm) * scaledSize;
 
-      const colorArray = Array.isArray(color) ? color : [color];
-      const lastPaletteColor = colorArray?.length
-        ? colorArray[colorArray.length - 1]
-        : undefined;
-
-      const codepoints = useMemo(
-        () => layers.map(([cp]) => cp),
-
-        [name]
-      );
-
-      const processedColors = useMemo(
-        () =>
-          layers.map(([, srcColor], i) => {
-            const layerColor =
-              colorArray?.[i] ?? lastPaletteColor ?? srcColor ?? 'black';
-            return (processColor(layerColor) ?? 0xff000000) as number;
-          }),
-
-        [name, color]
-      );
+      const nameStr = name as string;
+      const codepoints = getCodepoints(nameStr, layers);
+
+      const processedColors = useMemo(() => {
+        // Fast path: no custom color — use pre-computed defaults
+        if (color === undefined || color === null) {
+          return getDefaultColors(nameStr, layers);
+        }
+        const colorArray = Array.isArray(color) ? color : [color];
+        const lastPaletteColor = colorArray.length
+          ? colorArray[colorArray.length - 1]
+          : undefined;
+        return layers.map(([, srcColor], i) => {
+          const layerColor =
+            colorArray[i] ?? lastPaletteColor ?? srcColor ?? 'black';
+          return cachedProcessColor(layerColor as string);
+        });
+      }, [nameStr, color]);
 
       const nativeStyle = useMemo(
         () => [{ width, height: scaledSize }, style],