Threejs vs Blender the factors that are affecting

glb/gltf models that are created in blender often does not look the same when loaded in ThreeJS. Below are the factors that can greatly affect this. 

const renderer = new THREE.WebGLRenderer({ canvas });

renderer.gammaOutput = true;

renderer.gammaFactor = 2.2;

Below is the comparison between when disabled (first column) and when enabled

Below is with the flags enabled 

Below is without specifying the abovve property 

The original model from the Blender is 

So this seems closely matches the blender if enabled. 

Another property is 

This indicates whether the Whether to use physically correct lighting mode. Default is false. 

With this property is set to true, the app displayed as below 

renderer.physicallyCorrectLights = true;