Preact

# Preact Documentation This file contains comprehensive documentation for Preact v10, a fast 3kB alternative to React with the same modern API. Preact is a fast, lightweight alternative to React that provides the same modern API in a much smaller package. This documentation covers all aspects of Preact v10, including components, hooks, server-side rendering, TypeScript support, and more. --- ## Introduction **Description:** How to get started with Preact. We'll learn how to setup the tooling (if any) and get going with writing an application ### Getting Started New to Preact? New to Virtual DOM? Check out the [tutorial](/tutorial). This guide helps you get up and running to start developing Preact apps, using 3 popular options. If you're new to Preact, we recommend starting with [Vite](#create-a-vite-powered-preact-app). #### No build tools route Preact is packaged to be used directly in the browser, and doesn't require any build or tools: ```html <script type="module"> import { h, render } from 'https://esm.sh/preact'; // Create your app const app = h('h1', null, 'Hello World!'); render(app, document.body); </script> ``` The primary drawback of developing this way is the lack of JSX, which requires a build step. An ergonomic and performant alternative to JSX is documented in the next section. ##### Alternatives to JSX Writing raw `h` or `createElement` calls can be tedious. JSX has the advantage of looking similar to HTML, which makes it easier to understand for many developers in our experience. JSX requires a build step though, so we highly recommend an alternative called [HTM][htm]. [HTM][htm] is a JSX-like syntax that works in standard JavaScript. Instead of requiring a build step, it uses JavaScript's own [Tagged Templates](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals#Tagged_templates) syntax, which was added in 2015 and is supported in [all modern browsers](https://caniuse.com/#feat=template-literal