← back

Coming from Vue / React

Tape's component model is directly inspired by the patterns you know — props down, events up, single-file components. The difference is it compiles to native code, not a JS bundle.

single-file components

Vue SFC

<template> + <script> + <style>. Three languages (HTML, JS, CSS) in one file.

Tape

#code + #view + #style. Same concept — one file, multiple concerns — but every section speaks tape syntax.

reactivity

Vue / React

Proxy-based reactivity (Vue) or setState + virtual DOM diff (React). Runtime overhead.

Tape

var mutations set a dirty bit. The runtime repaints dirty components once per frame, however many mutations a handler made. No tree diff, no reconciliation pass.

events / emit

Vue

$emit('update', value) — string-based event names, runtime dispatch.

Tape

event on_update(val: i64) + fire on_update(val) — typed at compile time. Wrong handler signature = compile error.

conditional / list rendering

Vue / React

v-if / v-for (Vue) or {cond && <X/>} / .map() (React).

Tape

if (cond) { ... } and for (item in list) { ... } — same tape syntax inside view {}, evaluated when the view tree is built.

what stays the same

  • - Compiles to native machine code, not JavaScript
  • - No browser, no DOM, no CSS — tape renders directly
  • - Static types required (no any in t1 components)
  • - No npm, no bundler, no node_modules
  • - Desktop-native, not web-wrapped