跟著我欣賞一下用於Threejs的React渲染器,看看高手如何用JS、CSS建構超炫的react-three-fiber

首次看到這些物件讓我覺得非常新奇,感覺有藝術的成份在其中。可是當我仔細檢查它的語法後,簡直酷呆了。Html Js Css 在Web上跑動...太有趣了。

首次看到這些物件讓我覺得非常新奇,感覺有藝術的成份在其中。可是當我仔細檢查它的語法後,簡直酷呆了。Html Js Css 在Web上跑動...太有趣了。


保羅·亨舍爾· 德拉克姆達與45位數碼高手聯手創作了以下幾個作品。
我只能說 : "這真的有吸引到我的眼光",但它是怎麼辦到的,讓我很疑惑!

當然! 基本上它是基於React的專案-透過CodeSandbox的開發環境設計。(之後再特別介紹CodeSandBox(CSB))



我們先來看看其中一個內容,我在上面"玩了好一會"

穿越時空-可以用滑鼠控制,點擊發射光砲。


另外還有這些也不仿去看看。
1.這是海綿?砂包?還是...
2.感覺很怪異的東西

3.這個蠻有藝術感的
4.彩帶或者是紙屑飄飄
5.感覺也很具有藝術,剪影?

What is it?

This is a React renderer for Threejs on the web and react-native.
Building a dynamic scene graph becomes so much easier when you can break it up into declarative,
re-usable components that react to state changes.

Does it have regressions?

This is less of an abstraction and more of a pure reconciler (like react-dom in relation to HTML).
It does not target a specific Threejs version nor does it need updates when Threejs alters,
adds or removes features. It won't change any specifics or rules. There are zero limitations.

Is it slower than raw Threejs?

Rendering performance is up to Threejs and the GPU, react-three-fiber drives a renderloop outside of React
without overhead. React is otherwise very efficient in building and updating component-trees,
which could allow it to potentially outperform manual apps at scale.


  • Let's Connect
  • NakaHiraChow

    是一個在台灣深耕二十多年的設計策略顧問公司用心在地接連世界,將藝術科技化、科技藝術化讓設計充滿想像無邊界。我們深信美好的設計與知識文化分享,可以改變未來的世界。

或許您也會喜歡
推薦閱讀
@MAYAPHOTOGRAPHY