JSSugar 및 JSre의 새로운 개념이 웹사이트 속도를 늦추는 방법

안녕하세요 여러분! 오늘은 JS0과 JSSugar에 관해 많이 회자되는 주제에 대한 제 생각을 공유하고자 합니다. 제 생각에는 여기에는 잠재적으로 수십억 명의 웹사이트 사용자에게 숨겨져 있는 특정 위험이 있습니다. 이제 제가 의미하는 바를 설명하겠습니다.

제 관점이 마음에 안 드실 수도 있겠지만, dev.to에 댓글이 있으니 다 답변해 드리겠습니다.

내가 이해하는 JS0 개념 및 JSSugar 설명

아마도 제가 잘못 이해한 부분이 있거나 어딘가에 실수가 있었던 부분이 있을 수 있지만 최선을 다해 설명하겠습니다.

요컨대, 오늘날 자바스크립트에서는 더 많은 기능으로 기능을 확장하는 대신 사용자가 더 수용할 수 있도록 만드는 데 집중해야 합니다. 예를 들어, 오늘날 모든 개발자는 typescript, webpack 및 기타 여러 레이어를 거치는 코드를 작성하므로 개발자가 더 적은 코드를 작성하면 향후 버전의 ecmascript에서 이러한 단순화 논리를 적용하는 것은 어떨까요? 예를 들어, lodash나 jQuery와 같은 기능(예: forEach)을 생성해야 하고 이미 복잡하기 때문에 확장하지 않아야 한다는 비전을 표준으로 설정하세요.

JS0처럼 모든 것이 컴파일되는 환경을 위한 것이며 일반 개발자는 조건에 따라 for 대신 forEach를 사용할 수 있습니다.

이제 이 접근 방식에 심각한 문제가 발생하는 지점이 바로 여기입니다. "속도를 위해서가 아니다"라고 쓰여 있는 것 같지만 사실 벤치마크에서 자바스크립트 코드의 속도를 비교해본 사람이라면 누구나 내가 이해하는 바를 이해할 것이다.

코드 수량의 미세 최적화를 위한 느린 구현

예, 이제 연습을 시작할 시간입니다.

코드 #1

const a = [1,2,3,4,5]
a.forEach((e)=>{
  if(e === 4){
    console.log(e)
  }
})

코드 #2

const a = [1,2,3,4,5]
for (let index = 0; index 



<p><strong>결과:</strong></p>

<p><img src="/static/imghwm/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173599114392327.jpg?x-oss-process=image/resize,p_40" class="lazy" alt="How the new concepts of JSSugar and JSre able to slow down websites"></p>

<p>이제 또 다른 예를 들어보겠습니다.</p>

<p><strong>코드 #1</strong><br>
</p>

<pre class="brush:php;toolbar:false">const a = [1,2,3,4,5];
const b =  a.map((e)=>{
  return e + 1;
})

코드 #2

const a = [1,2,3,4,5]
const b = [];
for (let index = 0; index 



<p><strong>결과:</strong></p>

<p><img src="/static/imghwm/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173599114511292.jpg?x-oss-process=image/resize,p_40" class="lazy" alt="How the new concepts of JSSugar and JSre able to slow down websites"></p>

<p>결과는 https://jsbenchmark.com 사이트의 데이터를 기반으로 합니다.</p>

<p>그래서 내가 얻은 것은 TC39(기술위원회)와 일반적인 개발자 커뮤니티에서 상상해 보면 lodash 및 jQuery 함수를 만들 때 아이디어 제안의 주요 벡터가 그런 방향으로 움직일 것이라는 것입니다. , 이는 ECMAScript의 표준이 될 것이며 속도를 변경하지 않지만 실제로 애플리케이션 속도를 저하시키는 forEach와 같은 기능이 있을 것입니다. 물론 이것은 생각해 볼 가치가 있습니다.</p>

<p>여기 공식 슬라이드(새가 날아감)에서도 벡터가 이동해야 하는 위치가 표시되어 있으며 이는 사용자에게 편리합니다. </p><p><img src="/static/imghwm/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/173599114779291.jpg?x-oss-process=image/resize,p_40" class="lazy" alt="How the new concepts of JSSugar and JSre able to slow down websites"></p>

<p>그리고 느린 속도가 아닌 빠른 사이트를 사용하는 것이 사용자에게는 편리하지만 개발자에게는 "표현력이 더 풍부합니다."</p>

<p>그러니까 이게 갑자기 표준이 되었을 때 그런 기능이 앞장서지 않았으면 좋겠어요. SOLID, DRY 및 기타 원칙은 이미 최신 애플리케이션의 속도를 늦추고 있으며 이제는 이를 표준으로 삼고 있습니다.</p>

<h2>
  
  
  js-framework-benchmark의 영향
</h2>

<p>물론 이 기사는 js-framework-benchmark 저장소에서 작업한 경험에서 영감을 얻었습니다. 제 생각에는 오늘날 속도가 왜 중요한지 매우 분명하게 보여줍니다. 실제로 사람들은 웹사이트가 더 빠르게 로드되기를 원합니다. 이는 사실입니다. 오늘날 대부분의 최신 인기 프레임워크와 라이브러리는 실제로 느립니다. 누군가에게는 속도가 쓰레기인 것처럼 보일 수도 있지만 그렇지 않습니다. 모든 것을 하나로 합치면 이러한 "최적화"를 사용하면 웹 응용 프로그램이 몇 배 더 나빠질 것입니다. 그래서 이런 생각도 듭니다.</p>

<h2>
  
  
  결론
</h2>

<p>오늘 이런 아이디어가 나오다니 정말 좋네요. 이는 JavaScript와 모든 웹 프로그래밍을 발전시키지만 속도와 같이 무시해서는 안 되는 객관적인 요소도 있습니다.</p>


          

            
        

위 내용은 JSSugar 및 JSre의 새로운 개념이 웹사이트 속도를 늦추는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!