Docs: Improve post processing guide. (#26359)

docs/manual/en/introduction/How-to-use-post-processing.html

@@ -31,6 +31,7 @@
 		import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js';
 		import { RenderPass } from 'three/addons/postprocessing/RenderPass.js';
 		import { GlitchPass } from 'three/addons/postprocessing/GlitchPass.js';
+		import { OutputPass } from 'three/addons/postprocessing/OutputPass.js';
 		</code>
 
 		<p>
@@ -59,8 +60,8 @@
 		<p>
 			Our composer is now ready so it's possible to configure the chain of post-processing passes. These passes are responsible for creating
 			the final visual output of the application. They are processed in order of their addition/insertion. In our example, the instance of `RenderPass`
-			is executed first and then the instance of `GlitchPass`. The last enabled pass in the chain is automatically rendered to the screen. The setup
-			of the passes looks like so:
+			is executed first, then the instance of `GlitchPass` and finally `OutputPass`. The last enabled pass in the chain is automatically rendered to the screen. 
+			The setup of the passes looks like so:
 		</p>
 
 		<code>
@@ -69,12 +70,15 @@
 
 		const glitchPass = new GlitchPass();
 		composer.addPass( glitchPass );
+
+		const outputPass = new OutputPass();
+		composer.addPass( outputPass );
 		</code>
 
 		<p>
 			`RenderPass` is normally placed at the beginning of the chain in order to provide the rendered scene as an input for the next post-processing step. In our case,
-			`GlitchPass` is going to use these image data to apply a wild glitch effect. Check out this [link:https://threejs.org/examples/webgl_postprocessing_glitch live example]
-			to see it in action.
+			`GlitchPass` is going to use these image data to apply a wild glitch effect. `OutputPass` is usually the last pass in the chain which performs sRGB color space conversion and optional tone mapping.
+			Check out this [link:https://threejs.org/examples/webgl_postprocessing_glitch live example] to see it in action.
 		</p>
 
 		<h2>Built-in Passes</h2>

docs/manual/fr/introduction/How-to-use-post-processing.html

@@ -31,6 +31,7 @@
 		import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js';
 		import { RenderPass } from 'three/addons/postprocessing/RenderPass.js';
 		import { GlitchPass } from 'three/addons/postprocessing/GlitchPass.js';
+		import { OutputPass } from 'three/addons/postprocessing/OutputPass.js';
 		</code>
 
 		<p>
@@ -58,8 +59,8 @@
 
 		<p>
 			Notre composer est maintenant prêt, il est donc possible de configurer la chaîne d'effets de post-processing. Ces effets (passes) sont chargés de la création
-			de l'apparence visuelle finale de l'application. Ils sont traités dans l'ordre de leur ajout/insertion. Dans notre example, l'instance de `RenderPass`
-			est exécutée en première, puis l'instance de `GlitchPass` est exécutée. Le dernier effet activé de la chaîne est automatiquement rendu dans la scène. Le setup
+			de l'apparence visuelle finale de l'application. Ils sont traités dans l'ordre de leur ajout/insertion. In our example, the instance of `RenderPass`
+			is executed first, then the instance of `GlitchPass` and finally `OutputPass`. Le dernier effet activé de la chaîne est automatiquement rendu dans la scène. Le setup
 			des effets ressemble à ça:
 		</p>
 
@@ -69,12 +70,15 @@
 
 		const glitchPass = new GlitchPass();
 		composer.addPass( glitchPass );
+
+		const outputPass = new OutputPass();
+		composer.addPass( outputPass );
 		</code>
 
 		<p>
 			`RenderPass` est normalement placé au début de la chaîne pour fournir la scène rendue en tant qu'entrée pour les prochaines étapes de post-processing. Dans notre cas,
-			`GlitchPass` va utiliser les données de l'image pour appliquer un effet de glitch. Regardez cet [link:https://threejs.org/examples/webgl_postprocessing_glitch exemple live]
-			pour voir cela en action.
+			`GlitchPass` va utiliser les données de l'image pour appliquer un effet de glitch.  `OutputPass` is usually the last pass in the chain which performs sRGB color space conversion and optional tone mapping.
+			Regardez cet [link:https://threejs.org/examples/webgl_postprocessing_glitch exemple live] pour voir cela en action.
 		</p>
 
 		<h2>Effets Intégrés</h2>

docs/manual/it/introduction/How-to-use-post-processing.html

@@ -32,6 +32,7 @@
 		import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js';
 		import { RenderPass } from 'three/addons/postprocessing/RenderPass.js';
 		import { GlitchPass } from 'three/addons/postprocessing/GlitchPass.js';
+		import { OutputPass } from 'three/addons/postprocessing/OutputPass.js';
 		</code>
 
 		<p>
@@ -59,8 +60,8 @@
 
 		<p>
       Il composer è pronto, ed è possibile configurare la catena di passaggi di post-processing. Questi passaggi sono i responsabili per la creazione
-      dell'output visivo finale dell'applicazione. Vengono elaborati nello stesso ordine in cui sono stati aggiunti/inseriti. Nel nostro esempio, l'istanza
-      di `RenderPass` viene eseguita per prima, poi l'istanza di `GlitchPass`. L'ultimo passaggio abilitato della catena viene automaticamente renderizzato sullo schermo.
+      dell'output visivo finale dell'applicazione. Vengono elaborati nello stesso ordine in cui sono stati aggiunti/inseriti. In our example, the instance of `RenderPass`
+      is executed first, then the instance of `GlitchPass` and finally `OutputPass`. L'ultimo passaggio abilitato della catena viene automaticamente renderizzato sullo schermo.
       La configurazione dei passaggi è la seguente:
 		</p>
 
@@ -70,12 +71,15 @@
 
 		const glitchPass = new GlitchPass();
 		composer.addPass( glitchPass );
+
+		const outputPass = new OutputPass();
+		composer.addPass( outputPass );
 		</code>
 
 		<p>
       `RenderPass` viene normalmente posizionata all'inizio della catena per fornire la scena renderizzata come input per il passaggio successivo di post-processing.
-      Nel nostro caso `GlitchPass` utilizzarà questi dati di immagine per applicare un effetto glitch selvaggio. Guarda questo [link:https://threejs.org/examples/webgl_postprocessing_glitch esempio live]
-      per vederli in azione.
+      Nel nostro caso `GlitchPass` utilizzarà questi dati di immagine per applicare un effetto glitch selvaggio.  `OutputPass` is usually the last pass in the chain which performs sRGB color space conversion and optional tone mapping.
+      Guarda questo [link:https://threejs.org/examples/webgl_postprocessing_glitch esempio live] per vederli in azione.
 		</p>
 
 		<h2>Passi Built-in</h2>

docs/manual/ja/introduction/How-to-use-post-processing.html

@@ -33,6 +33,7 @@
 		import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js';
 		import { RenderPass } from 'three/addons/postprocessing/RenderPass.js';
 		import { GlitchPass } from 'three/addons/postprocessing/GlitchPass.js';
+		import { OutputPass } from 'three/addons/postprocessing/OutputPass.js';
 		</code>
 
 	<p>
@@ -61,8 +62,8 @@
 	<p>
 		composerが準備できたので、post-processingパスのチェーンを設定できるようになりました。
 		これらのパスはアプリケーションの最終的なビジュアルを出力することに責任を持ちます。
-		これらのパスは追加/挿入の順番で処理されます。今回示している例では、*RenderPass*インスタンスがはじめに実行され、
-		それから*GlitchPass*インスタンスが実行されます。チェーンの中で最後の有効なpassが自動的に画面に描画されます。
+		これらのパスは追加/挿入の順番で処理されます。In our example, the instance of `RenderPass`
+		is executed first, then the instance of `GlitchPass` and finally `OutputPass`。チェーンの中で最後の有効なpassが自動的に画面に描画されます。
 		passの設定は以下のように行います。
 	</p>
 
@@ -72,12 +73,16 @@
 
 		const glitchPass = new GlitchPass();
 		composer.addPass( glitchPass );
-		</code>
+
+		const outputPass = new OutputPass();
+		composer.addPass( outputPass );
+	</code>
 
 	<p>
 		*RenderPass*は普通チェインのはじめにあります。
 		これはレンダリングされたシーンを次のpost-processingの入力とするためです。
 		*GlitchPass*は、これらのイメージをワイルドなglitch effectを適用するために使います。
+		 `OutputPass` is usually the last pass in the chain which performs sRGB color space conversion and optional tone mapping.
 		実際に動いているものを見るために、[link:https://threejs.org/examples/webgl_postprocessing_glitch sample]を見てみましょう。
 	</p>
 

docs/manual/ko/introduction/How-to-use-post-processing.html

@@ -31,6 +31,7 @@
 		import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js';
 		import { RenderPass } from 'three/addons/postprocessing/RenderPass.js';
 		import { GlitchPass } from 'three/addons/postprocessing/GlitchPass.js';
+		import { OutputPass } from 'three/addons/postprocessing/OutputPass.js';
 		</code>
 
 		<p>
@@ -59,7 +60,7 @@
 		<p>
             composer는 이제 준비가 다 되었으니, 후처리 과정 연결을 설정할 수 있습니다.
             이러한 과정은 앱을 만드는 최종 화면 출력을 담당하며, 첨부/삽입한 순서대로 처리합니다.
-            이 예제에서 먼저 실행한 것은 *RenderPass* 인스턴스이고 그 다음이 *GlitchPass* 입니다.
+            In our example, the instance of `RenderPass` is executed first, then the instance of `GlitchPass` and finally `OutputPass`.
             마지막 과정이 끝나면 자동으로 화면에 렌더링됩니다. 패스 설정은 아래와 같습니다.
 		</p>
 
@@ -69,12 +70,16 @@
 
 		const glitchPass = new GlitchPass();
 		composer.addPass( glitchPass );
+
+		const outputPass = new OutputPass();
+		composer.addPass( outputPass );
 		</code>
 
 		<p>
-			*RenderPass*는 일반적으로 맨 위에 위치해서 렌더링된 장면을 후처리의 기본 입력 장면으로 활용합니다. 예제의 경우,
-            *GlitchPass*는 이 이미지 데이터에 거친 글리치 효과를 넣어줍니다. [link:https://threejs.org/examples/webgl_postprocessing_glitch live example]에서 작동을
-            확인해보세요.
+            *RenderPass*는 일반적으로 맨 위에 위치해서 렌더링된 장면을 후처리의 기본 입력 장면으로 활용합니다. 예제의 경우,
+            *GlitchPass*는 이 이미지 데이터에 거친 글리치 효과를 넣어줍니다. 
+             `OutputPass` is usually the last pass in the chain which performs sRGB color space conversion and optional tone mapping.
+            [link:https://threejs.org/examples/webgl_postprocessing_glitch live example]에서 작동을 확인해보세요.
 		</p>
 
 		<h2>기본 내장 후처리방식</h2>

docs/manual/pt-br/introduction/How-to-use-post-processing.html

@@ -31,6 +31,7 @@
 		import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js';
 		import { RenderPass } from 'three/addons/postprocessing/RenderPass.js';
 		import { GlitchPass } from 'three/addons/postprocessing/GlitchPass.js';
+		import { OutputPass } from 'three/addons/postprocessing/OutputPass.js';
 		</code>
 
 		<p>
@@ -58,8 +59,8 @@
 
 		<p>
 			Nosso composer já está pronto para que seja possível configurar a cadeia de passos de pós-processamento. Esses passos são responsáveis ​​por criar
-			a saída visual final do aplicativo. Eles são processados ​​na ordem de sua adição/inserção. Em nosso exemplo, a instância de `RenderPass`
-			é executada primeiro e depois a instância de `GlitchPass`. A última passagem habilitada na cadeia é renderizada automaticamente na tela. A configuração
+			a saída visual final do aplicativo. Eles são processados ​​na ordem de sua adição/inserção. In our example, the instance of `RenderPass`
+			is executed first, then the instance of `GlitchPass` and finally `OutputPass`. A última passagem habilitada na cadeia é renderizada automaticamente na tela. A configuração
 			dos passos fica assim:
 		</p>
 
@@ -69,12 +70,16 @@
 
 		const glitchPass = new GlitchPass();
 		composer.addPass( glitchPass );
+
+		const outputPass = new OutputPass();
+		composer.addPass( outputPass );
 		</code>
 
 		<p>
-			O `RenderPass` é normalmente colocado no início da cadeia para fornecer a cena renderizada como entrada para a próxima etapa de pós-processamento. No nosso caso,
-			o `GlitchPass` usará esses dados de imagem para aplicar um efeito de glitch selvagem. Confira este [link:https://threejs.org/examples/webgl_postprocessing_glitch exemplo]
-			para vê-lo em ação.
+			O `RenderPass` é normalmente colocado no início da cadeia para fornecer a cena renderizada como entrada para a próxima etapa de pós-processamento. 
+			No nosso caso, o `GlitchPass` usará esses dados de imagem para aplicar um efeito de glitch selvagem. 
+			 `OutputPass` is usually the last pass in the chain which performs sRGB color space conversion and optional tone mapping.
+			Confira este [link:https://threejs.org/examples/webgl_postprocessing_glitch exemplo] para vê-lo em ação.
 		</p>
 
 		<h2>Passes integrados</h2>

docs/manual/zh/introduction/How-to-use-post-processing.html

@@ -31,6 +31,7 @@
 		import { EffectComposer } from 'three/addons/postprocessing/EffectComposer.js';
 		import { RenderPass } from 'three/addons/postprocessing/RenderPass.js';
 		import { GlitchPass } from 'three/addons/postprocessing/GlitchPass.js';
+		import { OutputPass } from 'three/addons/postprocessing/OutputPass.js';
 		</code>
 
 		<p>
@@ -59,7 +60,7 @@
 		<p>
 			我们的合成器已经准备好了，现在我们就可以来配置后期处理过程链了。
 			这些过程负责创建应用程序的最终视觉输出，它们按照添加/插入的顺序来进行处理。
-			在我们的示例中，首先执行的是*RenderPass*实例，然后是*GlitchPass*。在链中的最后一个过程将自动被渲染到屏幕上。
+			In our example, the instance of `RenderPass` is executed first, then the instance of `GlitchPass` and finally `OutputPass`。
 			这些过程的设置类似这样：
 		</p>
 
@@ -69,12 +70,16 @@
 
 		const glitchPass = new GlitchPass();
 		composer.addPass( glitchPass );
+
+		const outputPass = new OutputPass();
+		composer.addPass( outputPass );
 		</code>
 
 		<p>
 			*RenderPass*通常位于过程链的开始，以便将渲染好的场景作为输入来提供给下一个后期处理步骤。
-			在我们的示例中，*GlitchPass*将会使用这些图像数据，来应用一个疯狂的故障效果。参见这个示例：
-			[link:https://threejs.org/examples/webgl_postprocessing_glitch live example]来看一看它的实际效果。
+			在我们的示例中，*GlitchPass*将会使用这些图像数据，来应用一个疯狂的故障效果。
+			 `OutputPass` is usually the last pass in the chain which performs sRGB color space conversion and optional tone mapping.
+			参见这个示例：[link:https://threejs.org/examples/webgl_postprocessing_glitch live example]来看一看它的实际效果。
 		</p>
 
 		<h2>内置过程</h2>