Prefer Hoisted Jsx Elements

Suggestion

small-rules/prefer-hoisted-jsx-elements

Prefer extracting static Roblox JSX intrinsic elements to module-level constants.

Diagnostic Messages

hoistableJsxElement

Extract `{{elementText}}` to a shared module-level const — this Roblox JSX element is fully static and identical elements should reuse the same const.

Configuration

This rule accepts one options object after the severity.

additionalHoistableComponentsOptional

Additional component names that can be hoisted to module-level constants.

Type

Array<string>

Default

-

additionalStaticFactoriesOptional

Additional factory functions whose return values are considered static.

Type

Array<string>

Default

-

{
  "jsPlugins": [
    "@pobammer-ts/small-rules"
  ],
  "rules": {
    "small-rules/prefer-hoisted-jsx-elements": [
      "error",
      {
        "additionalHoistableComponents": [
          "IconSprite"
        ],
        "additionalStaticFactories": [
          "Vector3"
        ]
      }
    ]
  }
}

Examples

Inline static JSX element

function View() {
  return <staticbadge />;
}

Dynamic component element

function View() {
  return <Component enabled={true} />;
}

Related Rules

Prefer Hoisted Jsx Object PropertiesRelatedWhole static elements and static prop objects are the two halves of JSX hoistability.No Static React Create ElementRelatedStatic createElement should be JSX; static JSX trees should then be hoisted when fully constant.