Docs updates for v2.0

Author: asundqui

docs/docs/0.1-2.0-migration-guide.md

@@ -4,13 +4,13 @@ Spark 2.0 was designed with backward-compatibility in mind. We expect most 0.1 a
 
 ## Update Spark dependencies
 
-- Install the latest version using NPM: `npm install @sparkjsdev/spark@2.0.0-preview`, or update your project's `package.json` to the latest Spark 2.0 release: `"@sparkjsdev/spark": "sparkjsdev/spark#v2.0.0-preview"`.
+- Install the latest version using NPM: `npm install @sparkjsdev/spark@2.0.0`, or update your project's `package.json` to the latest Spark 2.0 release: `"@sparkjsdev/spark": "^2.0.0"`.
 
 - The minimum THREE.js version is r179 in order to support 2D array textures when rendering to multiple targets ([THREE.js #31476](https://github.com/mrdoob/three.js/pull/31476)). Make sure you're project's `package.json` includes THREE.js using `"three": "0.179.0"` or higher.
 ```
   "dependencies": {
     "three": "0.180.0",
-    "@sparkjsdev/spark": "sparkjsdev/spark#v2.0.0-preview"
+    "@sparkjsdev/spark": "^2.0.0"
   },
 ```
 

docs/docs/index.md

@@ -16,14 +16,17 @@ Copy and paste code below in an `index.html` file or remix in the [Web Playgroun
 </script>
 <script type="module">
   import * as THREE from "three";
-  import { SplatMesh } from "@sparkjsdev/spark";
+  import { SparkRenderer, SplatMesh } from "@sparkjsdev/spark";
 
   const scene = new THREE.Scene();
   const camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 0.01, 1000);
   const renderer = new THREE.WebGLRenderer();
   renderer.setSize(window.innerWidth, window.innerHeight);
   document.body.appendChild(renderer.domElement)
 
+  const spark = new SparkRenderer({ renderer });
+  scene.add(spark);
+
   const splatURL = "https://sparkjs.dev/assets/splats/butterfly.spz";
   const butterfly = new SplatMesh({ url: splatURL });
   butterfly.quaternion.set(1, 0, 0, 0);
@@ -40,13 +43,14 @@ Copy and paste code below in an `index.html` file or remix in the [Web Playgroun
 ## Install with NPM
 
 ```shell
-npm install sparkjsdev/spark#v2.0.0-preview
+npm install @sparkjsdev/spark
 ```
 ## Develop and contribute to Spark
 
 Build Spark (It requires [Rust](https://www.rust-lang.org/tools/install) installed in your machine)
 ```
 npm install
+npm run build:wasm
 npm run dev
 ```
 

docs/docs/spark-renderer.md

@@ -1,6 +1,6 @@
 # SparkRenderer
 
-Spark internally uses a `SparkRenderer` object in your `THREE.Scene` to perform splat rendering. Spark will automatically create a `SparkRenderer` and add it to your scene if you don't create one yourself. For more advanced use cases such as multiple viewpoints, rendering environment maps, or tuning rendering parameters such as Level-of-Detail (LoD), you can create your own `SparkRenderer` and add it anywhere in the scene, for example at the root:
+Spark internally uses a `SparkRenderer` object in your `THREE.Scene` to perform splat rendering. Create a `SparkRenderer` and add it anywhere to your scene (for example at the root), and use it to adjust rendering parameters such as Level-of-Detail (LoD):
 ```typescript
 const spark = new SparkRenderer({
   renderer: myThreeJsWebGlRenderer,
@@ -13,16 +13,10 @@ scene.add(spark);
 
 ```typescript
 const spark = new SparkRenderer({
-  // Commonly used parameters
   renderer: THREE.WebGLRenderer;
   maxStdDev?: number;
-  focalDistance?: number;
-  apertureAngle?: number;
-  falloff?: number;
-  focalAdjustment?: number;
   sortRadial?: boolean;
   lodSplatScale?: number;
-
   pagedExtSplats?: boolean;
   target?: { width: number; height: number; doubleBuffer?: boolean },
 });

docs/docs/system-design.md

@@ -11,8 +11,7 @@ Each `SparkRenderer` has a default `SparkViewpoint` that reads back a list of al
 Finally, on the next THREE.js render() call, `SparkRenderer` invokes a single instanced geometry draw call to draw all the scene's splats in the correct back-to-front order, merging with other opaque THREE.js geometry using the Z buffer. The sort order lags the render by at least one frame, but possibly more on older devices, but is not usually perceptible.
 
 ```typescript
-// Optionally add a SparkRenderer to the scene to manage SplatMesh rendering.
-// If none is created, Spark will create one for you automatically.
+// Add a SparkRenderer to the scene to manage SplatMesh rendering.
 const spark = new SparkRenderer({ renderer: webGlRenderer });
 scene.add(spark);
 ```