Skip to content
Exemplary real world application built with Preact
TypeScript Other
Branch: master
Clone or download

RealWorld Example App

Build Status Coverage Status

Forked from hassanbazzi/preact-realworld-example-app

Preact X codebase containing real world examples (typescript, hooks, preact-router, fetch, etc) that adheres to the RealWorld spec and API.

Demo RealWorld

This codebase was created to demonstrate a fully fledged fullstack application built with [Preact] including CRUD operations, authentication, routing, pagination, and more.

We've gone to great lengths to adhere to the [Preact] community styleguides & best practices.

For more information on how to this works with other frontends/backends, head over to the RealWorld repo.

Getting started

# install dependencies
yarn install

# start development
yarn start

# run tests (with coverage)
yarn test --coverage

# build
yarn build

# analyzer bundle size
yarn analyzer

Bundle size

Bundle analyzer

There is 72KB left after gzip for the whole project, It was larger than I expected because I didn't introduce redux/mobx, using preact hooks.

history.js is too big, I don't want it, but I have to use it to hash history.

I used axios before, and later I created a fetch tool myself to further reduce the packet size.

According to the report, Preact isn't much ahead of React.

However, if history.js is removed, I think it can be compared with the data of Vue.

Here's what happens when you remove history.

Bundle analyzer(no history.js)

You can’t perform that action at this time.