createSignal + createRenderEffect

function Input(props) {
  const [value, setValue] = createSignal<Exclude<typeof props["value"], undefined>>()
  createRenderEffect(() => {
    setValue(props.value)
  })
  
  createEffect(() => {
    doClientSideOnlyStuff(value())
  })

  return (
    <input
      // ... many other stuff
      value={value()}
      onInput={(e) => {
        const previous = value()
        // expose normally
        props.onInput?.(e)

        if (!e.defaultPrevented && value() === previous && previous !== e.target.value) {
          // this order matter, first locally
          setValue(e.target.value)
        }
      }}
    />
  )
}

function Input(props) {
  const [value, setValue] = createSignal<Exclude<typeof props["value"], undefined>>()
  createRenderEffect(() => {
    setValue(props.value)
  })
  
  createEffect(() => {
    doClientSideOnlyStuff(value())
  })

  return (
    <input
      // ... many other stuff
      value={value()}
      onInput={(e) => {
        const previous = value()
        // expose normally
        props.onInput?.(e)

        if (!e.defaultPrevented && value() === previous && previous !== e.target.value) {
          // this order matter, first locally
          setValue(e.target.value)
        }
      }}
    />
  )
}