PNG packed js demos don't work now on chrome
category: general [glöplog]
I was running my old 1k js webgl demo, and nop... I does not work now on chrome.
http://www.backtothepixel.com/demos/js/webgl/704webgl1k.html
I tried it on firefox, and it was ok, also on my iPhone it is ok.
But on an Android tablet did not work.
I also tried Condition by FMS_Cat and same problem.
Are you also having this problem? Did Chrome and all browsers like Chromium/webkit kill the PNG hack? :(
http://www.backtothepixel.com/demos/js/webgl/704webgl1k.html
I tried it on firefox, and it was ok, also on my iPhone it is ok.
But on an Android tablet did not work.
I also tried Condition by FMS_Cat and same problem.
Are you also having this problem? Did Chrome and all browsers like Chromium/webkit kill the PNG hack? :(
I guess that just some break...
Magister by Straylight still works.
BTW here is that PNG stuff explained https://web.archive.org/web/20151121005049/http://daeken.com/superpacking-js-demos
For my 704.2 I used
JsExe by adinpsz
Magister by Straylight still works.
BTW here is that PNG stuff explained https://web.archive.org/web/20151121005049/http://daeken.com/superpacking-js-demos
For my 704.2 I used
JsExe by adinpsz
hmm... http://psenough.github.io/leviathan_sun/ mine seem to still work fine, you have to click on the window while it's loading to get sound though.
i used gasman's pnginator script instead of jsexe though if i remember correctly. eitherway, sourcecode is available if you want to check the difference.
i used gasman's pnginator script instead of jsexe though if i remember correctly. eitherway, sourcecode is available if you want to check the difference.
checking yours on debug console, seems to still be wanting to do the webgl instructions, just didn't apply the canvas on the screen by some reason.
condition also works fine on desktop chrome, just the link on pouet is 404 since fms-cat.com no longer exists, but if you find the repo and it's proper github.io page, it works.
Quote:
I was running my old 1k js webgl demo, and nop... I does not work now on chrome.
http://www.backtothepixel.com/demos/js/webgl/704webgl1k.html
Code:
VM8:1 WebGL: INVALID_OPERATION: useProgram: program not valid
eval @ VM8:1
onload @ 704webgl1k.html:4
VM8:1 WebGL: INVALID_OPERATION: getUniformLocation: program not linked
eval @ VM8:1
onload @ 704webgl1k.html:4
254WebGL: INVALID_OPERATION: drawArrays: no valid shader program in use
VM8:1 WebGL: too many errors, no more errors will be reported to the console for this context.
hum... there is some happening, some demos still work, true.
I didn't change anything in both demos, of course, and I confirm the errors that Gargaj said.
When running the 64k version of Condition I get this errors:
The dev version of Condition runs fine.
So maybe is something not related with the PNG, but related with another compression technique, like the webgl function hashing, or something else.
But I confirm, that on all my machines I have this problem, and every thing works fine in Firefox.
I didn't change anything in both demos, of course, and I confirm the errors that Gargaj said.
When running the 64k version of Condition I get this errors:
Code:
Uncaught DOMException: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data.The dev version of Condition runs fine.
So maybe is something not related with the PNG, but related with another compression technique, like the webgl function hashing, or something else.
But I confirm, that on all my machines I have this problem, and every thing works fine in Firefox.
Condition works fine using a local server, the error was because I just "double clicked" the html.
Nop.. lol... I just assumed that after the "Wait a moment..." everything was ok.
I also have error messages on Condition, even using a local server.
I also have error messages on Condition, even using a local server.
Code:
The AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page. https://goo.gl/7K7WLu
Eo @ VM8:2
Wo @ VM8:2
Wo @ VM8:2
eval @ VM8:2
eval @ VM8:2
eval @ VM8:2
eval @ VM8:2
onload @ condition_1280x720_final.html:243
36WebGL: INVALID_VALUE: uniform2fv: no array
71WebGL: INVALID_VALUE: uniform3fv: no array
35WebGL: INVALID_VALUE: uniform4fv: no array
35WebGL: INVALID_VALUE: uniformMatrix4fv: no array
35WebGL: INVALID_VALUE: uniform1iv: no array
condition_1280x720_final.html:1 [.WebGL-00002C50000A7F00] GL_INVALID_OPERATION: Active draw buffers with missing fragment shader outputs.
condition_1280x720_final.html:1 [.WebGL-00002C50000A7F00] GL_INVALID_OPERATION: Two textures of different types use the same sampler location.
42performance warning: READ-usage buffer was read back without waiting on a fence. This caused a graphics pipeline stall.
VM8:2 WebGL: too many errors, no more errors will be reported to the console for this context.
eval @ VM8:2
bind @ VM8:2
useProgram @ VM8:2
W @ VM8:2
eval @ VM8:2
Vn @ VM8:2
ao @ VM8:2
Kn @ VM8:2
update @ VM8:2
eval @ VM8:22
requestAnimationFrame (async)
e @ VM8:2
I've tried running a more small js demos and many work, only a few have problems.
Examples of webgl JS demos that don't wotk now on chrome.
Hypersonic Mandelbulb
ANDES
HBC-00016: Core Critical
704.2
Condition by FMS_Cat
Condition psenough said that it works, but on my pc I also get the same errors
But the problem it's not the PNG hack, is something else.
Hypersonic Mandelbulb
ANDES
HBC-00016: Core Critical
704.2
Condition by FMS_Cat
Condition psenough said that it works, but on my pc I also get the same errors
But the problem it's not the PNG hack, is something else.
i think it's the same bug that i had with latest drivers during inércia. ie: gl_FragColor being deprecated and drivers only now starting to complain about it not being legal. from couple checks i think those intros use gl_FragColor
https://stackoverflow.com/questions/51459596/using-gl-fragcolor-vs-out-vec4-color
https://stackoverflow.com/questions/51459596/using-gl-fragcolor-vs-out-vec4-color
@ps: That's about desktop GL, not WebGL.
@ps, The uncompresed demo works fine.
Like @kusma said that is not a problem on webGL code, and it's not a Chrome problem.
The problem is the webgl function hash tecnique that does not work, in new versions... as it was expected...
With more recent webgl and browsers, there are more functions and names will colide.
Here is the uncompressed code of by 704.2
I compared the functions list and this specific hash where F is the Canvas element:
Colides in this names:
"It works on the compo machine!" -> DONE lol
I guess we will have to say something like, "It works on Chrome 95." because we never know what new webgl versions will bring. So future generations will know that that specific demo works on a specific version of Chrome, or browsers from a specific period...
Like @kusma said that is not a problem on webGL code, and it's not a Chrome problem.
The problem is the webgl function hash tecnique that does not work, in new versions... as it was expected...
With more recent webgl and browsers, there are more functions and names will colide.
Here is the uncompressed code of by 704.2
Code:
X=F.width=innerWidth;Y=F.height=innerHeight;for(x in g=F.getContext("webgl"))g[x[i=0]+x[6]]=g[x];with(g)p=cP(),s=cS(k=35633),sS(s,"attribute vec4 a;void main(){gl_Position=a;}"),ce(s),aS(p,s),s=cS(--k),sS(s,"precision highp float;uniform float s;float n(vec3 n){return min(length(vec3(sin(n.x)+sin(s),n.y,sin(n.z)+cos(s)))-1.5-sin(length(n)-s*4.),n.y+3.);}void main(){float m,y;vec3 l=vec3(sin(s*.7),0,cos(s*.9))*10.,v=vec3(sin(s*.7)*20.+20.,(sin(s)*4.+7.),cos(s*.6)*20.+14.)+l,c=normalize(l-v),x=normalize(cross(vec3(sin(s),1,0),c)),d=normalize(c+(-1.+2.*gl_FragCoord.x/"+X+".)*x*"+X+"./"+Y+".+(-1.+2.*gl_FragCoord.y/"+Y+".)*cross(c,x)),z,g=vec3(.1,0,0);m=.1;z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);if(z.y<2.5)c=z.y<-2.5?vec3(0,1,0):normalize(n(z)-vec3(n(z-g.xyy),n(z-g.yxy),n(z-g.yyx))),x=z.y<-2.5?(fract(z/4.).x>.5?fract(z/4.).z>.5?vec3(0):vec3(1):fract(z/4.).z>.5?vec3(1):vec3(0))*max(n(z+vec3(0,1,0)),.5):vec3(sin(length(z)/4.-s*4.),sin(s),sin(length(z)-s*4.))*.5+.5,l=(dot(c,normalize(v-z))+.2)*x*.7+pow(dot(c,normalize(v-z)),54.)*.7,g.z=1.-m*.01,d=reflect(d,c),v=z,y=z.y;m=.1;z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);z=v+d*m;m+=n(z);if(z.y<2.5&&abs(y)<2.5)c=z.y<-2.5?vec3(0,1,0):normalize(n(z)-vec3(n(z-g.xyy),n(z-g.yxy),n(z-g.yyx))),x=z.y<-2.5?(fract(z/4.).x>.5?fract(z/4.).z>.5?vec3(0):vec3(1):fract(z/4.).z>.5?vec3(1):vec3(0))*max(n(z+vec3(0,1,0)),.5):vec3(sin(length(z)/4.-s*4.),sin(s),sin(length(z)-s*4.))*.5+.5,l+=(dot(c,normalize(v-z))+.2)*x*.3;gl_FragColor=vec4(l*g.z,1);}"),ce(s),aS(p,s),vA(lo(p),2,5126,eV(ug(p)),bf(k-=670,cB()),bD(k,new Float32Array([1,1,1,-3,-3,1]),k+82)),t=gf(p,"s"),m=.001*Date.now(),(k=function(){dr(4,uniform1f(t,.001*Date.now()-m),3);requestAnimationFrame(k)})()I compared the functions list and this specific hash where F is the Canvas element:
Code:
for(x in g=F.getContext("webgl"))g[x[i=0]+x[6]]=g[x]Colides in this names:
- ce: function [c]ompil[e]Shader() -> ce: function [c]learD[e]pth()
- vA: function [v]ertex[A]ttribPointer() -> vA: function [v]ertex[A]ttrib4f()
"It works on the compo machine!" -> DONE lol
I guess we will have to say something like, "It works on Chrome 95." because we never know what new webgl versions will bring. So future generations will know that that specific demo works on a specific version of Chrome, or browsers from a specific period...
wait wait WAit, you're telling me you all were calculating function name hashes which included only the first and 6th letters of each function name?
@gasman nice! True, it was something that was predictable
@ferrisWell it's definitely not a "hash" function like SHA-256 LOL It's more like "let's try to get lucky and only use 2 positions of the function name"
@ferrisWell it's definitely not a "hash" function like SHA-256 LOL It's more like "let's try to get lucky and only use 2 positions of the function name"
@gasman Again, very very cool I didn't remember that thread.
Some JS1K prods don't work now. The winner "Legend Of The Bouncing Beholder for example, does not work now probably for the same reason.
Some JS1K prods don't work now. The winner "Legend Of The Bouncing Beholder for example, does not work now probably for the same reason.
Nothing learned from the "import by ordinal" 4k desaster. Yay.
@ferris A more correct name should be "Mechanized Abbreviation" from https://marijnhaverbeke.nl/js1k/
gasman, that must be the best "told you so!" i've seen in a long time. also props to finding back a 12 year old post.
@T$: It's not really comparable with import by ordinal. It's just import by hash with a really, really poor hash function.
A hash function so poor that the final outcome is extremely close to that of the import by ordinal disaster?
Sounds totally comparable with respect to the outcome - if you ask me. ;)
Sounds totally comparable with respect to the outcome - if you ask me. ;)
Ouch. It's pretty good that it took ~12 years to break, though!
Quote:
It's pretty good that it took ~12 years to break, though!
My thoughts :D
