URL: https://apps.praxxys.global/
Rationale
We are a digital agency based in the Philippines 
. One of the main challenges in South East Asia and other developing countries is that mobile internet is painfully slow/unreliable, and wifi is not too great outside the city centers.
Hence, our goal was to create a small, lightweight, highly performant yet visually appealing three.js experience to showcase a few projects from our portfolio. After all, what good is an experience that just gets stuck at the loading screen 
We are very pleased with the results, particularly as the performance freaks we are, as we have been able to trim down the entire base experience to 4.16 MB (gzipped) 
which performs extremely well even on lower-end devices.
Our long term goal is to make three.js experiences more accessible to the internet-underprivileged.
Website Features
- Ultra-lightweight base experience only at 4.16 mb (gzipped)
- Highly performant, runs at 30+ fps even on lower-end devices
- Minimal dependencies, powered only by three.js, R3F, drei, and GSAP.
Featured Sections
Landing Section
- Meet our main protagonist, the iPhone, which tells the story throughout the experience.
- We see some instanced mesh triangles flying about with a bit of randomization, animated via (a pretty long) Catmull-Rom curve.
- Then we see the logo rendered in drei’s MeshTransmissionMaterial
Portfolio Section
- We see logos of some of our present and past clients behind our company motto: Make it Happen
Featured Project: Kawasaki
- Say hello to Kawasaki Ninja 250 as well as a global map rendered via map/alphaMap textures
Featured Project: Philippines LRT 1 Train Ride
- Experience a simulated train ride in Metro Manila’s LRT1 line, feel free to ride again!
Featured Project: Nature’s Spring Ecommerce
- Walkthrough the entire app experience and say hello once again to Kawasaki Ninja
Ending Frame
- Open a magical portal to another galaxy
- The “sigil” is made up of the symbols of the sun, all of the major planets, and 16 minor planets of the solar system
- For the glow effect, unfortunately Unreal Bloom was too expensive to use so we ended up using textures/alphaMap cheat codes instead, still looks pretty decent!
- We rewrote the old lightning example in three.js docs into ES6 to be able to use it in this scene
- The galaxy scene is something inspired from a lesson from Three.js Journey by Bruno Simon. We added a few mouse interactions to the vertex and fragment shaders to simulate warping space time.
Overall, we’re happy with the results, since we feel that we have been able to achieve the goal of making three.js experiences more accessible by making them load extremely fast (4.16 mb!) and perform well, framerate-wise, even on older devices, all while making it still look pretty decent.
Any feedback is very much appreciated! Especially on how to trim performance even further 
Do let us know what you think and we hope that we can all work together to make more accessible three.js experiences for the global community.
- John, PRAXXYS Team
