0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

SvelteAdvent Calendar 2024

Day 13

Svelte で 3D 表示を行うライブラリ Threlte Ex2: Threlte 8 が控えているのを察知した

Last updated at Posted at 2024-12-12

はじめに

こちらは、Threlte の Ex(エクストラ、余談的な)シリーズの記事の一つ。

先のアドベントカレンダーにて、Threlte 8 が縦鼻中であることが分かったので、ならば、その内容を見られる範囲で追ってみようかというネタ。

Threlte の現状

Threlte は、Svelte の Three.js ラッパーとして存在する。
そんな立場であるが故、Svelte のバージョンには敏感になるというのが事実としてある。

逆に Three.js に対してはどうか?というと、意外と Three.js に関しては、本質的な変化は特になく、基本時術は変わらないので、そちらはそこまで気にする必要はない。
もちろん、USD などのパイプラインに絡むレベルの話は追っておく必要があるので、そこまで気にするのであれば、Three.js を生で使うのが良いという解決策になる。
それが故に、あえて言うのであれば、Svelte のバージョン変化にセンシティブになっていればいいというだけではある。

Threlete 8 の変化

さて、本題の Threlete の 8 バージョンに関して、どういう登場を控えているかを整理したい。

Svelte 5 への対応

ここ数か月の多きな話題といえば Svelte 5 の登場だろう。
Rune を導入したり、export prop の仕方も変化し、より洗練された Svelte としてのフロントエンドフレームワークとして成り立ってきた。

とあれば、Threlte はそれに追従することになる。
という事で第一は Svelte 5 への対応。それこそが Threlte 8 の大きなマイルストーンとなっている。

Threlte 側は、この Svelte 5 の対応に関して GitHub プロジェクト側で公開している。

{@render children()} への対応

その中でも {@render children()} への対応は、Svelte 5 らしいなと感じた。

userSize() の廃止

Threlte 8 では、userSize() を廃止し、親コンポーネントのサイズの影響を受ける事ができるようになった。
これによって、Web サイト上の埋め込みとしてもデザインコントロールがしやすいようになる。

<div style="width: 500px; height: 300px;">
  <Canvas>...</Canvas>
</div>

より保守性を目指したタイプ生成への移行

これまでのコンポーネントにたいして、ほとんどがマニュアルでタイプファイルを作成したとのこと(す、すげぇ…)。
でもまぁ、やはり、こうして Svelte 5 といった根柢フレームワーク側の変更が行われると、その部分も追従するには把握の困難も極めるというもの。

Threlte 8 では、より生成側で自動でサポートされる運用にシフトしようとしている様子。

さいごに

実際のところ、根柢の設計に対する大きな変更はそこまで大きなものはない様子。
むしろ Svelte 5 への変化をよく意識するようにし、それに合わせて Threlte を使用していくとよいということだろう。

これから、自らで作成していくものは Svelte 5 ベースで行きたいので、ぜThrelte 8 のリリースも期待したい。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?