This PR upgrades this project to be compatible with Vue 3. There are some notable changes:
We are now using Three.js directly instead of the Three-Full wrapper package.
We are using the Vue 3 composition API and component <script setup> wherever possible.
Based on @Camil88's research most of the Three.js elements are added to the store with the markRaw helper. This is a recommended best practice for storing non-reactive elements in state. Eliminating reactivity where it is not needed should help lower overall memory usage and improve performance.
Rather than upgrade to the latest version of Vuex this PR uses Pinia for state management, which is the new preference in the Vue community.
HMR has been disabled; I have noticed some memory issues that seem to be aggravated by HMR. This may require further investigation. In theory this should not impact an application in production.
I have included a docker setup for those who are interested - this is optional.
This PR upgrades this project to be compatible with Vue 3. There are some notable changes:
<script setup>wherever possible.markRawhelper. This is a recommended best practice for storing non-reactive elements in state. Eliminating reactivity where it is not needed should help lower overall memory usage and improve performance.