refactor: transform TDefaultTextualRenderer to render function

Too many elements is bad for performance

Author: jsamr

packages/render-html/src/TPhrasingRenderer.ts

@@ -4,7 +4,7 @@ import { useTNodeChildrenRenderer } from './context/TChildrenRendererContext';
 import { TDefaultRenderer } from './shared-types';
 import { TNodeSubRendererProps } from './internal-types';
 import useAssembledCommonProps from './hooks/useAssembledCommonProps';
-import TDefaultTextualRenderer from './TDefaultTextualRenderer';
+import renderTextualContent from './renderTextualContent';
 
 export const TDefaultPhrasingRenderer: TDefaultRenderer<TPhrasing> = ({
   children,
@@ -18,7 +18,7 @@ export const TDefaultPhrasingRenderer: TDefaultRenderer<TPhrasing> = ({
       tnode,
       propsForChildren
     });
-  return React.createElement(TDefaultTextualRenderer, props, resolvedChildren);
+  return renderTextualContent(props, resolvedChildren);
 };
 
 function InnerTPhrasingRenderer(props: TNodeSubRendererProps<TPhrasing>) {

packages/render-html/src/TTextRenderer.ts

@@ -4,18 +4,14 @@ import { TDefaultRenderer, TDefaultRendererProps } from './shared-types';
 import { TNodeSubRendererProps } from './internal-types';
 import { useInternalTextRenderer } from './context/RenderRegistryProvider';
 import useAssembledCommonProps from './hooks/useAssembledCommonProps';
-import TDefaultTextualRenderer from './TDefaultTextualRenderer';
+import renderTextualContent from './renderTextualContent';
 
 export const TDefaultTextRenderer: TDefaultRenderer<TText> = ({
   children,
   ...props
 }: TDefaultRendererProps<TText>) => {
   const { tnode } = props;
-  return React.createElement(
-    TDefaultTextualRenderer,
-    props,
-    children ?? tnode.data
-  );
+  return renderTextualContent(props, children ?? tnode.data);
 };
 
 function TStandardTextRenderer(props: TNodeSubRendererProps<TText>) {

packages/render-html/src/hooks/useInternalRenderer.ts

@@ -1,6 +1,5 @@
 import { TagName } from '@native-html/transient-render-engine';
 import { ComponentType } from 'react';
-import AElement from '../elements/AElement';
 import IMGElement from '../elements/IMGElement';
 import OLElement from '../elements/OLElement';
 import ULElement from '../elements/ULElement';
@@ -25,7 +24,7 @@ const specialRenderersConfig = {
   },
   a: {
     hook: useAElementProps,
-    Element: AElement
+    Element: undefined
   }
 };
 
@@ -64,7 +63,7 @@ export default function useInternalRenderer<T extends TagName>(
   const { TDefaultRenderer, ...rendererProps } = props;
   if (hasSpecialInternalRenderer(tagName)) {
     return {
-      Renderer: specialRenderersConfig[tagName].Element,
+      Renderer: specialRenderersConfig[tagName].Element || TDefaultRenderer,
       rendererProps: specialRenderersConfig[tagName].hook(props as any)
     } as any;
   }

…der-html/src/TDefaultTextualRenderer.tsx …render-html/src/renderTextualContent.tsxpackages/render-html/src/TDefaultTextualRenderer.tsx renamed to packages/render-html/src/renderTextualContent.tsx packages/render-html/src/TDefaultTextualRenderer.tsx renamed to packages/render-html/src/renderTextualContent.tsx

@@ -1,16 +1,18 @@
-import React from 'react';
+import React, { ReactNode } from 'react';
 import { Text } from 'react-native';
 import { TPhrasing, TText } from '@native-html/transient-render-engine';
-import { TDefaultRenderer } from './shared-types';
+import { TDefaultRendererProps } from './shared-types';
 
-const TDefaultTextualRenderer: TDefaultRenderer<TPhrasing | TText> = ({
-  tnode,
-  style,
-  children,
-  textProps,
-  nativeProps,
-  onPress
-}) => {
+const renderTextualContent = (
+  {
+    tnode,
+    style,
+    textProps,
+    nativeProps,
+    onPress
+  }: TDefaultRendererProps<TPhrasing | TText>,
+  children: ReactNode
+) => {
   const resolvedStyles = [style, nativeProps?.style, textProps.style];
   return React.createElement(
     Text,
@@ -26,4 +28,4 @@ const TDefaultTextualRenderer: TDefaultRenderer<TPhrasing | TText> = ({
   );
 };
 
-export default TDefaultTextualRenderer;
+export default renderTextualContent;