Skip to main content
Module

x/fastro/post/preact_and_encrypted_props.md

Full Stack Framework for Deno, TypeScript, Preact JS and Tailwind CSS
Go to Latest
File

title: “Fastro v0.80.0: Preact and Server Side Props Encryption” description: “Preact integration and robust encryption of Server Side Props” image: https://fastro.deno.dev/fastro.png author: Yanu Widodo date: 08/16/2023

Previously, Fastro used React for server-side-rendering (SSR).

The author of this framework is very happy with it. Applications become faster and directly generate HTML syntax to the browser without waiting.

Table of contents

Errors in React

Until the time I started building a fullstack apps, there were some really annoying issues in development and production mode.

In development mode: when I put my cursor to an input and leave from the input, it always produce error like this.

In production mode: useContext and useState always produce errors like this.

I’ve been looking for a solution, but haven’t found satisfactory answers yet. Existing solutions are usually related to Node.js and Next.js.

First try with Preact

Instead of waiting for a long time, I finally tried another alternative: Preact.

The result makes me very happy.

With JSX which is almost similar to React, all the errors above are gone.

And one more thing, the minimal bundle file is only 6.5kB!

In React, bundle files in production are at least 40 kB. The size will increase if there are additional modules.

Server Side Props Encryption

This version also adds server-side props encryption for JSX using Web Crypto API.

This feature makes sensitive data sent from servers difficult to see from the browser.