3 ms·

JSX is only type-checked because someone wrote a type-checker for it. It's completely possible to write a type-checker for HTML templates like lit-html. In Typ

JSX is only type-checked because someone wrote a type-checker for it. It's completely possible to write a type-checker for HTML templates like lit-html. In TypeScript we even have access to third-party extensible interfaces for all the elements with the HTMLElementTagNameMap, so we can check buildings to properties. We'll be working on a lit-html type-checker for TypeScript early next year.

dmitriid 8y ago
Well, you can skip JSX, and write functions only, and you'll have full support. https://reactjs.org/docs/react-without-jsx.html https://reactjs.org/docs/react-without-jsx.html It's functions all the way down, after all. How do you write a type checker for something that is a string (HTM, lit-html)?
- deleted 8y ago
  [deleted]
- spankalee 8y ago
  You parse the string literal, just like you parse the string that is the contents of a JavaScript file.
  - dmitriid 8y ago
    Yeah, I'll let Javascript engines parse and convert my Javascript to bytecode for me. It's definitely not the same as manually parsing strings at runtime. And equating the two is disingenuous at best
    - spankalee 8y ago
      Type-checking happens at compile time, and even the JS is parsed by a user-land library and not the JS engine. At runtime these templates are parsed by the browser's built-in HTML parser.
      - dmitriid 8y ago
        > Type-checking happens at compile time, and even the JS is parsed by a user-land library and not the JS engine. True. Still, it's functions and regular JS, not strings manually processed at runtime > At runtime these templates are parsed by the browser's built-in HTML parser. It's not the first time I've seen this ... bullshit (no other word for it). Where does it come from? The only time it's parsed by browser's built-in HTML parser is when you manually call something like `element.innerHtml = "you string that you manually assembled in your function at runtime"`. The browser has no idea what is contained in your tagged string. Which is painfully obvious when you actually look at the implementations of HTM: https://github.com/developit/htm/blob/master/src/index.mjs#L36 https://github.com/developit/htm/blob/master/src/index.mjs#L... or lit-html: https://github.com/Polymer/lit-html/blob/master/src/lib/template-result.ts#L47 https://github.com/Polymer/lit-html/blob/master/src/lib/temp...
  - bcherny 8y ago
    You could definitely do that (Angular recently started doing this too!). I think once there is a way to enforce compile time safety for HTM, it’ll be a lot more appealing for TypeScript/Flow folks.
bcherny 8y ago
I think type safety was a core design constraint for JSX (since XHP — where JSX came from — is typechecked, after all). It’s also nice to be able to do this checking with the type system you already have (TS, Flow, Reason), rather than having to install extra tooling that has to then interoperable with each of these type systems.
rickycook 8y ago
well no... it’s type checked because it’s transpiled to a function

dmitriid 8y ago

Well, you can skip JSX, and write functions only, and you'll have full support. https://reactjs.org/docs/react-without-jsx.html https://reactjs.org/docs/react-without-jsx.html It's functions all the way down, after all. How do you write a type checker for something that is a string (HTM, lit-html)?

deleted 8y ago
[deleted]
spankalee 8y ago
You parse the string literal, just like you parse the string that is the contents of a JavaScript file.
- dmitriid 8y ago
  Yeah, I'll let Javascript engines parse and convert my Javascript to bytecode for me. It's definitely not the same as manually parsing strings at runtime. And equating the two is disingenuous at best
  - spankalee 8y ago
    Type-checking happens at compile time, and even the JS is parsed by a user-land library and not the JS engine. At runtime these templates are parsed by the browser's built-in HTML parser.
    - dmitriid 8y ago
      > Type-checking happens at compile time, and even the JS is parsed by a user-land library and not the JS engine. True. Still, it's functions and regular JS, not strings manually processed at runtime > At runtime these templates are parsed by the browser's built-in HTML parser. It's not the first time I've seen this ... bullshit (no other word for it). Where does it come from? The only time it's parsed by browser's built-in HTML parser is when you manually call something like `element.innerHtml = "you string that you manually assembled in your function at runtime"`. The browser has no idea what is contained in your tagged string. Which is painfully obvious when you actually look at the implementations of HTM: https://github.com/developit/htm/blob/master/src/index.mjs#L36 https://github.com/developit/htm/blob/master/src/index.mjs#L... or lit-html: https://github.com/Polymer/lit-html/blob/master/src/lib/template-result.ts#L47 https://github.com/Polymer/lit-html/blob/master/src/lib/temp...
- bcherny 8y ago
  You could definitely do that (Angular recently started doing this too!). I think once there is a way to enforce compile time safety for HTM, it’ll be a lot more appealing for TypeScript/Flow folks.

bcherny 8y ago

I think type safety was a core design constraint for JSX (since XHP — where JSX came from — is typechecked, after all). It’s also nice to be able to do this checking with the type system you already have (TS, Flow, Reason), rather than having to install extra tooling that has to then interoperable with each of these type systems.

rickycook 8y ago

well no... it’s type checked because it’s transpiled to a function