After much reading, it seems that when people say, browser engine, they refer to the layout engine such as gecko or webkit.
I also know that the layout engine is basically responsible for "painting" the screen and the javascript engine is used for interpreting.
Question though, is for a modern web app, which has a bigger impact on performance? And how related are this two? What are their other uses outside the browser. What other functions do they serve.
Thank you very much.
Whichever engine your content taxes the most will have the biggest impact. If you have a gigantic, complex HTML document with thousands of complex nodes and elaborate CSS, you will be taxing the layout/rendering engine a lot, and therefore you might notice differences between the various browsers. However, for the most part I believe your content has to be pretty darn complex for significant differences to manifest.
On the javascript side, if your page is highly dynamic with lots of callbacks processing many rapid events and making big changes to the document in response to those events, the javascript engine will have a larger impact on your page's performance.
Outside of a browser, sometimes the layout/rendering engine will be used in a "headless" program such as PhantomJS. The Javascript engines can be used for interpreting javascript in non-browser environments as is done with node.js, Rhino, etc.
