wasm-bindgen
react-three-fiber
Our great sponsors
wasm-bindgen | react-three-fiber | |
---|---|---|
44 | 113 | |
7,270 | 25,908 | |
1.7% | 2.3% | |
9.2 | 9.1 | |
2 days ago | 7 days ago | |
Rust | TypeScript | |
Apache License 2.0 | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
wasm-bindgen
-
If the native speed DOM/Web API for Rust becomes a reality, would you be willing to build your web apps with Rust and HTML/CSS?
Another strange issue could be seen in the strict class heritage organized definition of the DOM, which can not be handled very well by rust because of a still unsolved bindgen issue (#210).
-
Rust + WASM + Typescript [+ React]
For a much simpler but less flexible approach there's wasm-pack for creating JS packages from Rust, and wasm-bindgen for easy interop. Both have very good documentation.
-
We Just Released our Rust WebTransport Teleconferencing System - Here are Some Lessons Learned
We encountered quite a few hurdles on our journey. For one, we had to build our own yew-webtransport and yew-websocket integration from scratch by adding WebTransport definitions to wasm-bindgen (pull request link). We also had to add WebTransport support to the h3 crate (pull request link). co-created by @ten3roberts
-
Looking to create a backend service for a website in Rust and Iām wondering on how to best do it
Go with your WebAssembly module idea. Since it sounds like your chess engine does not draw a UI, it shouldn't be too difficult. wasm-bindgen will be your best friend.
-
Ask HN: How can a BE/infra developer handle the FE side of personal projects?
I've never tried it, but apparently some bindings exist, e.g. https://github.com/rustwasm/wasm-bindgen
So you can either try manipulating the DOM w/ some bindings or draw to canvas.
-
I'm trying to compile my rust code to wasm but wasm_bindgen says the trait bound `(Vec<i32>, Vec<i32>): IntoWasmAbi` is not satisfied.
Google also brings up this GitHub issue.
-
Deno Fresh WASM: Code Modules in Rust
If you want to learn more on wasm-pack, there is a wasm-pack book as well as some fairly detailed wasm-bindgen docs. There are a few resources for learning Rust itself in the December newsletter. Finally, please get in touch if you would like to see more content on Deno and Fresh. I hope you found the content useful and am keen to hear about possible improvements.
-
Swift Achieved Dynamic Linking Where Rust Couldn't
Love the article.
In my mind I see the problem of dynamic linking in rust to have a bunch of overlap with the "I want this rust library to be exposed in my higher level GC'd language with minimal safety/handwritten bindings" problem.
My hunch is that the lack of expressiveness of the C ABI is holding back both. the thing I'd love to see some sort of "higher level than the C ABI" come out. And something like `wasm-bindgen`[0] to exist for more languages.
Here's a link to the rust "interopable_api" proposal! I don't understand all the implications, but it seems to be in the right direction https://github.com/rust-lang/rust/pull/105586
[0]https://rustwasm.github.io/docs/wasm-bindgen/
-
The Next Browser Language
Rust has https://github.com/rustwasm/wasm-bindgen and https://crates.io/crates/sledgehammer, the latter of which batches together JS calls to reduce the FFI cost. https://dioxuslabs.com/ uses these to great effect.
-
1Password releases Typeshare, the "ultimate tool for synchronizing your type definitions between Rust and other languages for seamless FFI"
This seems like it could be super useful for integrating with wasm-bindgen and TypeScript. Last I checked, the types generated by wasm-bindgen left a lot to be desired (no disrespect intended, wasm-bindgen is an awesome project). A few years ago, I contributed the skip_typescript attribute to wasm_bindgen that allowed you to override the type generation by hand-writing your own types (using a custom typescript section), but I wonder if this could simply generate higher quality types without the manual intervention.
react-three-fiber
-
3JS Job Market
this is perfect then. a large part of the threejs userbase is using https://github.com/pmndrs/react-three-fiber (roughly 1/4, and growing) and this is also where you find lots of job opportunities. fiber has a vast eco system, but if you can pair this with your knowledge of shaders you'll find a job tomorrow if you wanted.
-
Next topics for mastering frontend
there's 3d with threeJS you could play around with that and hooking it into react with react-three-fiber.
-
Was anyone able to make a 3D CAD tool in React?
Have you looked at this: https://github.com/pmndrs/react-three-fiber
-
CLI vs Expo
Only instance in recent memory where I was able to get something working with Expo but not the CLI was when trying to integrate react-three-fiber, but even that may be resolved now.
-
Getting started with 3D web development
this will put you at a massive advantage: https://github.com/pmndrs/react-three-fiber it's a renderer, just like react-dom, it won't change what threejs is or how it functions.
-
Suggestions needed
there's a whole eco system around three in react and next. it starts with react-three-fiber, drei has tons of helpers, and then there's three-next for when you need 100% lighthouse, persisting canvas across routes etc.
-
Built a new splash page at the beginning of the year. Used the opportunity to experiment with react-three-fiber.
I picked the stack I did to expand upon my skill set. In particular, I wanted to brush up on react-three-fiber, react-spring & drei.
-
My own collection so far :)
I think the easiest for you would be to get into this through web development try this https://github.com/pmndrs/react-three-fiber coupled with this https://github.com/pmndrs/react-xr But don't expect super beautiful graphic from this, it's abstraction over three.js library which is abstraction over webgl standard which implements OpenGL ES 2.0 which is 7 years old graphics standard targeted to mobile devices with not much power. Or you can experiment with unity (unity XR) or unreal engine which are harder to learn but produce better graphics.
-
Why react?
On the technical side, the ability to have pluggable renderers has been very useful for us. We never would have considered 3D without react-three-fiber. Building cli applications with react-ink is pretty cool.
-
3D Product Card With ReactJS
Then, we need to install the dependencies that we will use in this project. We will use Three.js library, @react-three/fiber and @react-three/drei.
What are some alternatives?
wasm-pack - š¦āØ your favorite rust -> wasm workflow tool!
drei - š„ useful helpers for react-three-fiber
wasmer - š The leading Wasm Runtime supporting WASIX, WASI and Emscripten
BabylonJS - Babylon.js is a powerful, beautiful, simple, and open game and rendering engine packed into a friendly JavaScript framework.
wasmtime - A fast and secure runtime for WebAssembly
THREE.MeshLine - Mesh replacement for THREE.Line
trunk - Build, bundle & ship your Rust WASM application to the web.
Next.js - The React Framework
wasi-libc - WASI libc implementation for WebAssembly
framer/motion - Open source, production-ready animation and gesture library for React
rust-analyzer - A Rust compiler front-end for IDEs [Moved to: https://github.com/rust-lang/rust-analyzer]
three.js - JavaScript 3D Library.