Question

const scrollPercent = getScrollPercent();
const mainDivHeight = (mainDivRef.current as any).offsetHeight;
const imgHeight = (imgRef.current as any).offsetHeight;

const offset = ((imgHeight - mainDivHeight) * scrollPercent) / 100;

setBgrImgStyle(x =>
    Object.assign({}, x, { transform: `translateY(-${offset}px)` })
);

如所见，我们有很多const声明只能使用一次，这意味着它们可以简单地内联。

我经常这样做以提高可读性，有时可能会提高可读性。

性能成本是多少？上面的代码是JS，不过，我很高兴收到与语言无关的答案。

Answer 1

在将操作放入一个被循环调用数十万次的过程之前，请不要担心性能会有所提高。在此之前，请专注于代码的清晰度。如果某件事没有成千上万次发生，那不是问题。也许您可以使用https://jsperf.com，即使您确实在意。

Answer 2

在现实的现代世界中？

可能没有。

大多数应用程序还是会打包JS并将其丑化。如果您不这样做，则应该这样做，因为这会减少您的有效负载，并具有使示例变得无关紧要的额外好处。

一个简短的例子：

var get = function(information){
   var name = information.Name;

   if (name == 'john'){var get=function(n){if("john"==n.Name)return!1};
     return false;
   }    
}

减少为：

var get=function(n){if("john"==n.Name){return!1}};

如果您正在做的是使代码更具可读性，则Webpack / uglification或其他可能会看到的代码并为您进行必要的调整。

因此，请担心可读的功能代码。当发现实际性能问题时，请担心性能。

中介变量-性能成本是多少？

2 个答案: