Babylon.JS, le moteur 3D WebGL open source simple & performant

Michel Rousseau

UI, UX, design

Microsoft France, division Dx

Blog :http://aka.ms/michel

twitter : @rousseau_Michel

[email protected]

David Rousset

web, IE, gaming

Microsoft Corp, division Dx

Blog : http://blogs.msdn.com/b/davrous/

twitter : @davrous

[email protected]

David Catuhe

web, IE, javascript

Microsoft Corp, division Dx

Blog : http://blogs.msdn.com/b/eternalcoding/

twitter : @deltakosh

[email protected]

#mstechdays

techdays.microsoft.fr

Le point de vue de l’artiste

les assets, c’est fait de :-géométries

- textures

- shaders

-entitésdiverses (lumières, sons, caméras, …)

- talent

Plutôt que des mots,

démo…

#mstechdays


L’audio

tech.days 2015#mstechdays

Le moteur audio de Babylon.js

Basé sur Web Audio

Son ambiant, omnidirectionnels ou directionnels

Son 3D en atténuation linéaire par défaut

Gérable par code ou via le format .babylon

Exportateur 3DS Max (Blender et Unity à venir)

On essaie de faire toujours aussi simple

#mstechdays


Les performances


Debug layer

Nombre de draw calls

Temps passe par fonctionnalité

Nombre d’objets

Nombre de vertices actifs

GPU / CPU locked

User marks + F12

Débusquer les pertes de performances


Niveaux de details

Définition de modèles en fonction de la distance

Décimation: processus automatique de réduction

LOD et décimation


Instances

Hardware instancing: réplication matérielle d’un seul modèle (SMMP: Single Model Multiple Position)

Multiplication des pains


Scene Optimizer

Sacrifier des fonctions pour de meilleures performances

Automatisation de l’optimisation

options = BABYLON.SceneOptimizerOptions.LowDegradationAllowed();


Scene OptimizerAutomatisation de l’optimisation

LowDegradationAllowed

• Level 0: MergeMeshes, Shadows and

LensFlares

• Level 1: PostProcesses and Particles

• Level 2: Texture(2, 1024)

ModerateDegradationAllowed


LensFlares



• Level 3: RenderTargets

• Level 4: HardwareScaling(4, 2)

HighDegradationAllowed


LensFlares



• Level 3: RenderTargets

• Level 4: HardwareScaling(4, 4)


Depth RendererConnaitre le fond des choses

Génération automatique d’une texture contenant le depth buffer

Permet de nombreux effets


#mstechdays

le moteur 3D webGlopen source simple & performant

@deltakosh

@davrous

@rousseau_michel

Babylon.JS, le moteur 3D WebGL open source simple & performant

Technology

Transcript of Babylon.JS, le moteur 3D WebGL open source simple & performant