Theo's Typesafe Cult•3y ago

Can you (or should you I suppose) put a type inside of a component?

Primarily asking in relation to performance. I know that putting a type inside of a component is something that you can do, but does it give any performance hit to do so? This is more just to put types right on top of functions that reside inside of a component, instead of doing them inline. Example:

const BlahComponent = () => {
  const myFunction = ({foo, bar, baz}: {foo: string, bar: string, baz: string}) => null;

  return <></>
}

const BlahComponent = () => {
  const myFunction = ({foo, bar, baz}: {foo: string, bar: string, baz: string}) => null;

  return <></>
}

const BlahComponent = () => {
  type Props = {
    foo: string;
    bar: string;
    baz: string;
  }
  const myFunction = ({foo, bar, baz}: Props) => null;

  return <></>
}

const BlahComponent = () => {
  type Props = {
    foo: string;
    bar: string;
    baz: string;
  }
  const myFunction = ({foo, bar, baz}: Props) => null;

  return <></>
}

7 Replies

KyleOP•3y ago

obviously you can put the type outside of the component, but that also requires scrolling all the way up the page to make modifications In other words: since typescript is only a development tool, does using type inside of the component cause additional code to rerun? I assume not since I don't believe that typescript keeps the types in whatsoever once compiled.

KyleOP•3y ago

Okay I think I answered my own question lol

KyleOP•3y ago

So I guess my question now is if this is an antipattern or not

Unknown User•3y ago

Message Not Public

KyleOP•3y ago

well - yes But I guess the issue becomes if I have like 5 functions inside of a component, all with different types. Would it be nicer to have the types just right on top of the functions? Or should they just all stack on top? I'd probably keep them out, but it always feels obnoxious to have to navigate it

Unknown User•3y ago

Message Not Public

KyleOP•3y ago

yeah for sure. I'll probably refactor it now that I think about it.

Gaming

Programming

Can you (or should you I suppose) put a type inside of a component?