A low-profile component framework. 1 file. 1 class. ~350 lines of code. No build tools are required. Native web components. Ideal for JAM stacks. Identical on client & server. Composition oriented. Event delegation by default. Lots of examples. Building a component with Tonic starts by creating a function or a class. The class should have at least one method named render which returns a template literal of HTML. onic is a thin wrapper around web components. Web components require a name with two or more parts. So your class name should be CamelCased (starting with an uppercase letter). Tonic has no templating language, it uses HTML! But since HTML only understands string values, we need some help to pass more complex values to a component, for that we use this.html. There is no evidence that Virtual DOMs improve performance across a broad set of use cases, but it's certain that they greatly increase complexity. Tonic doesn't use them. Instead, we recommend incremental updates.

Features

  • 1 file. 1 class. ~350 lines of code
  • Identical on client & server
  • Event delegation by default
  • Composition oriented
  • Native web components
  • Ideal for JAM stacks

Project Samples

Project Activity

See All Activity >

Categories

Frameworks

License

MIT License

Follow Tonic

Tonic Web Site

You Might Also Like
Our Free Plans just got better! | Auth0 by Okta Icon
Our Free Plans just got better! | Auth0 by Okta

With up to 25k MAUs and unlimited Okta connections, our Free Plan lets you focus on what you do best—building great apps.

You asked, we delivered! Auth0 is excited to expand our Free and Paid plans to include more options so you can focus on building, deploying, and scaling applications without having to worry about your secuirty. Auth0 now, thank yourself later.
Try free now
Rate This Project
Login To Rate This Project

User Reviews

Be the first to post a review of Tonic!

Additional Project Details

Programming Language

JavaScript

Related Categories

JavaScript Frameworks

Registered

2022-12-02