Why is code faster in the browser than on the desktop

Hi everyone,

I saw this code on https://www.openprocessing.org/sketch/656607 and I ran it in Processing 1.51 , Processing 2.2 and Processing 3.54 and the web version on the above link runs faster and much smoother.

Why do java apps run better in a browser than on the desktop?

Hi :slight_smile: Welcome to the forum!

I think one should not conclude that something performs better than something else based on just one example :slight_smile:

I would say it depends on many things, like which browser you’re using, which GPU you have, the CPU speed, etc.

This specific sketch can perform very fast on desktop by calling sphereDetail(5); to lower the sphere resolution from 30 to 5 (for example).

  • Be aware that a Processing Java Mode sketch running on the web isn’t Java anymore.
  • It is auto-transpiled to JS and uses the JS lib Processing.js (Pjs) instead: ProcessingJS.org
  • Pjs mimes most of Java Mode’s API, but its internal implementation is very diff. than Processing’s.
  • And b/c of that, sketch performance can vary between the 2 flavors depending on what internal API that sketch touches.

So essentially @GoToLoop and @hamoid what you two are saying is that system performance on the desktop is using my local setup whereas the internet compilation of my code is handled and processed in the backend… resulting in a variation in performance?

So in theory instead of running apps on the desktop… you can essentially develop on the desktop and execute higher framerates in the browser … nice. Still having the desktop and server-side processed running parallel… that is pretty cool.

Not exactly my thoughts :slight_smile: The desktop Processing IDE compiles Java to java byte code. Code that runs in a browser is most of the time JavaScript. Often a programmer can make a program faster in one language or the other, if she knows how to write efficient code. A language doesn’t make a program magically faster. So an interesting question would be, how easy is it to write efficient code in a given language?

Here something related in StackOverflow:

Processing.js programs are written in Java syntax, and then JavaScript converts the program to JavaScript (I know, sounds weird). It’s not the “backend”, the conversion happens in your browser before the program runs. You can think of it as a trick to be able to run Processing/Java code in a JavaScript environment. Unlike p5.js, which is plain JavaScript, no conversion happening.

And there are lots of aspects to think about when choosing the language. For example, Processing (Java) provides a bunch of libraries that are not available when using Processing.js or p5.js. Which is true in the opposite direction: you can’t use the p5.js libraries in Processing. One runs in the browser, which is great to show your creation to anyone online. The other provides powerful libraries that you may need in your project, but then you are have to run the program in a local computer. Which is fine for an interactive art installation, for example.

One more thing, if you use shaders (GPU programming) then it doesn’t make so much difference which one you are choosing as sometimes you can even reuse the same shader program (with minor modifications) both in Processing and in p5.js, but not in Processing.js, because it doesn’t support shaders afaik.

About the example you posted: in my computer it runs much better in Processing than in the browser.

2 Likes

That example runs too fast in the browser for me, slow in the PDE … just right after exporting the 64 bit exe.

Also, after converting it to p5.js it runs very nice too …