You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I have a simple html templating implementation that allows templates like <div>###var###</div> to be rendered by providing the variable values. My first implementation was simple repeated template.replaceAll("###" + name + "###", value). Benchmarking this on the number of substitutions, performance predictably drops when number of variables grows:
Template variable renders per second with 10 variables: 2672krps
Template variable renders per second with 20 variables: 2075krps
Template variable renders per second with 30 variables: 1840krps
Template variable renders per second with 40 variables: 1668krps
Template variable renders per second with 50 variables: 1553krps
Template variable renders per second with 60 variables: 1450krps
Template variable renders per second with 70 variables: 1270krps
Template variable renders per second with 80 variables: 1181krps
Template variable renders per second with 90 variables: 1075krps
Template variable renders per second with 100 variables: 996krps
Now I optimized this by parsing the positions of the tags and using string.slice() to minimize string allocations. This provided significant performance increase and getting rid of the degradation (counting number of variable substitutions). You can even see performance increasing as string operations start to dominate the overhead of other things.
Template variable renders per second with 10 variables: 5993krps
Template variable renders per second with 20 variables: 6307krps
Template variable renders per second with 30 variables: 6477krps
Template variable renders per second with 40 variables: 6650krps
Template variable renders per second with 50 variables: 6767krps
Template variable renders per second with 60 variables: 6778krps
Template variable renders per second with 70 variables: 5107krps
Template variable renders per second with 80 variables: 5118krps
Template variable renders per second with 90 variables: 5049krps
Template variable renders per second with 100 variables: 5074krps
However there's a strange drop at 70 variables which makes no sense. This is not really that important (probably will never hit 70 variables and still much faster), just curious. Probably not even bun specific but something with the JS engine, how the shallow copies of slice are handled and having some limit. But if anyone has smart ideas would love to hear :)
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
Uh oh!
There was an error while loading. Please reload this page.
Uh oh!
There was an error while loading. Please reload this page.
-
I have a simple html templating implementation that allows templates like
<div>###var###</div>to be rendered by providing the variable values. My first implementation was simple repeatedtemplate.replaceAll("###" + name + "###", value). Benchmarking this on the number of substitutions, performance predictably drops when number of variables grows:Now I optimized this by parsing the positions of the tags and using
string.slice()to minimize string allocations. This provided significant performance increase and getting rid of the degradation (counting number of variable substitutions). You can even see performance increasing as string operations start to dominate the overhead of other things.However there's a strange drop at 70 variables which makes no sense. This is not really that important (probably will never hit 70 variables and still much faster), just curious. Probably not even bun specific but something with the JS engine, how the shallow copies of slice are handled and having some limit. But if anyone has smart ideas would love to hear :)
Beta Was this translation helpful? Give feedback.
All reactions