You have a library - a fully loaded 2014 Babylon.js.

You have a fragment shader - let's call it sample.fragment.fx.

You have a scene - loaded ahead of time, possibly from a .babylon JSON file.

Your goal is to assign the fragment shader to every textured object in the scene using a snippet of JavaScript or TypeScript code.


The main multiplier is calculated in the form of one divided by the total number of bytes in the snippet not counting whitespace characters used for formatting.

Additional multipliers (apply one for each condition met) -

*0.5 (bad) - The solution does not reference the "sample" fragment shader by name.

*0.8 (bad) - The solution is presented in TypeScript.

*1.1 (good) - The solution implements a proper for loop (either the for or forEach keyword is used).

*1.2 (good) - The solution intelligently applies the shader only to objects that meet a certain arbitrary criterion, for example: it has texture, or it has a certain prefix in its name.

*1.3 (good) - After all multipliers are applied, the score is greater than 0.008.

This should remain open indefinitely. The highest score wins.


2 Answers 2


In Javascript

// The suffix of all meshes wich should have the shader applied
var suffix = "shader";

//If true, the shader will be applied on this mesh
var predicate = function(mesh) {
    return (
       && mesh.name.indexOf(suffix , mesh.name.length - suffix.length) !== -1

// Creation of the shader material
var shaderMaterial = new BABYLON.ShaderMaterial("sampleShader", scene, "sample", {
            attributes: ["position"],
            uniforms: ["worldViewProjection"]

// Apply the shader on all meshes
scene.meshes.forEach(function(m) {
    if (predicate(m)) {
        m.material = shaderMaterial;
  • \$\begingroup\$ Welcome to PPCG.SE! Please add your score to your answer. :) \$\endgroup\$ Commented Jul 9, 2014 at 10:13
  • \$\begingroup\$ Thanks :) How can I do that ? \$\endgroup\$
    – Temechon
    Commented Jul 9, 2014 at 12:19
  • 1
    \$\begingroup\$ Well, count the non-whitespace characters. There are some online tools for that. I tend to just copy it into a text editor with regex-replace feature and replace \s by nothing to remove all whitespace, then look at how many bytes are left in the file. That's the base score, then you'll have to apply the scoring mechanism described in the challenge. Also you can of course save quite a few bytes by using single-letter variable names instead of suffix, predicate and shaderMaterial. \$\endgroup\$ Commented Jul 9, 2014 at 12:21
  • \$\begingroup\$ Thank you, and you're right about the variables. I didn't know the scoring was about the file size. I will update my solution accordingly. \$\endgroup\$
    – Temechon
    Commented Jul 9, 2014 at 14:06
var t = new BABYLON.ShaderMaterial("sh", scene, "./sample", {
    attributes: ["uv"], uniforms: ["view"]

scene.meshes.forEach(function(m) { m.material = m.material && t; });

score : 1/164 * 1.1 (forEach) * 1.2 (material predicate) = 0.00804 * 1.3 = 0.0104


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.