Vize
言語としての Vue
"Characterize Vue.js" では、Vue は UI フレームワークとしてだけでなく、UI を記述するための言語としても構成されています。
その枠組みが重要です。
Vue が単なるライブラリである場合、ツールは JavaScript のラッパーのコレクションである可能性があります。
Vue が UI 用の言語である場合、ツールは言語環境になる必要があります。
Vue は UI の知識を整理します
Vue ファイルは、近くに小さな HTML を備えた単純な JavaScript ではありません。
言語機能を通じて UI の知識を整理します。
- テンプレート式
v-if、v-for、v-bind、v-onなどのディレクティブ- コンポーネントの境界
- プロップとエミット
- スロット
- 範囲指定されたスタイル
- コンパイラに基づいたレンダリング
- 単一ファイルのコンポーネント構造
これらは偶然の便宜ではありません。これらは、繰り返し発生する UI 問題に名前とルールを付ける方法です。
それが言語の役割です。
彼らは人間が考えるためのより良い形状を提供することで、ドメインを書き込み可能にします。
言語には環境が必要です
Vue を言語に似たシステムとして受け入れると、ツールチェーンの疑問は変わります。
もはや次のように尋ねるだけでは十分ではありません。
- 同梱できますか？
- 一部を型チェックできますか?
- スクリプト ブロックを lint できますか?
- 編集者はそれを強調表示できますか?
より良い質問は次のとおりです。
この言語を中心に構築できる最も強力な環境は何ですか?
フロントエンド言語環境の場合、これは次のことを意味します。
- コンパイラのフィードバック
- 糸くずのフィードバック
- フォーマッタの安定性
- 型チェック
- 編集者のインテリジェンス
- コンポーネントのドキュメント
- 視覚的な回帰テスト
- デザインシステムの制約
- AI 読み取り可能な診断
- 現実世界のプロジェクトの検証
目標は、すべてを悪くする 1 つのコマンドを作成することではありません。
目標は、すべての層が他の層を改善できるように環境を十分に一貫性のあるものにすることです。
断片化が Vue を傷つける理由 詳細
断片化はどのツールチェーンでも厄介ですが、Vue では断片化が特に目立つようになります。
.vue ファイルは複数の言語にまたがっており、次のような問題があります。
- HTML 風のテンプレート
- JavaScript または TypeScript
- CSS とプリプロセッサ
- フレームワークディレクティブ
- 生成されたレンダリングコード
- テンプレートの型チェック用の仮想 TypeScript
すべてのツールがそのファイルの異なるスライスを参照する場合、ユーザーはコストを支払います。
- 診断結果が一致しない
- 発生源の位置がドリフトする
- コンパイラ出力と lint 出力は異なる仮定をエンコードします
- AI 修復提案が間違ったレイヤーをターゲットにしている
- エディターの動作は CI の動作とは異なります
Vue にとって最も強力な環境は、SFC が 1 つの成果物として理解される環境です。
それが Vize の背後にあるアーキテクチャ上の賭けです。
フロントエンド環境は厳格かつ創造的でなければなりません
フロントエンド ツールには誤った選択があります。環境を厳格で不快なものにするか、環境を柔軟で信頼性の低いものにするかのどちらかです。
Vue は親しみやすいため、常に強力です。小規模から始めて、より大きな構造に成長させることができます。
Vize はその精神を維持しながら、より厳格なワークフローを実用化する必要があります。
- 迅速な診断によりチェックがスキップされません
- 厳密さがノイズにならないように正確なルール
- コンパイラの変更をレビュー可能な状態に保つためのスナップショット
- Musea によりデザイン システムが探索可能になります
- AI の統合により、コード生成により決定的なフィードバックが得られます
- ツールチェーンが生産パターンから学習するための現実世界の備品
最も強い環境とは、最も多くのルールがある環境ではありません。
これは、ルール、コンパイラー、エディター、および設計フィードバックがすべて同じメンタル モデルをサポートするものです。
Vize がこの分野に存在する理由
Vize は、Vue を中心にその環境を構築する実験です。
それは次のようなものだけではありません。
- コンパイラ
- リンター
- フォーマッタ
- 型チェッカー
- LSP
- コンポーネントギャラリー
- AI統合ポイント
これは、これらのサーフェスが 1 つの Vue 対応コアを共有するようにする試みです。
言語環境の価値はツールの数ではないため、これは重要です。価値はそれらの間の関係の質です。
コンパイラとリンターが一致すると、信頼が高まります。 編集者と CI が同意すると、摩擦は減ります。 Musea と静的解析が一致すると、設計システムが実行可能になります。 AI と診断が一致すると、生成はより安全になります。
フロントエンドには今これが必要です
フロントエンド開発はますます複雑になっています。
- 大規模なアプリケーション
- さらなるフレームワーク機能
- アクセシビリティに対する期待の厳格化
- デザインシステムの作業が増える
- より多くの型レベルのモデリング
- より多くの AI 生成コード
- デバイスとプラットフォームにわたるより多くの制作面
答えは「プラグインをさらにインストールする」だけではありません。
その答えはより良い環境にあるはずです。
Vue はすでに UI を記述するための言語を提供しています。 Vize は、その言語を中心に可能な限り最強のフロントエンド環境を構築することが何を意味するのかを模索しています。つまり、高速、厳密、デザインを意識し、AI 対応で、実際のプロジェクトに基づいた環境です。
それが長期的なビジョンです。