본질적으로 느린 폴리머로드 시간

나는 cli 도구를 사용하여 최소 폴리머 2 어플리케이션을 만들었습니다. 변경 사항없이 폴리머 서비스 만 실행하면 Fast3G에서 처음으로로드 한 첫로드 시간은 4 초가됩니다. 폴리머를 만든 후에도 4 초 남았습니다. 상단에본질적으로 느린 폴리머로드 시간

이 ... 쉘, 폴리머 요소, 중포 기지에 대한 모든 HTML 가져 오기에 시간을로드

난 그냥 index.html을에 로더를 정 +의로드 시간을 받아들이고 사용해야합니까, 서버 - 옆면 렌더링 & 앰프 또는 다른 해결 방법이 있습니까?

나는 서비스 노동자와 함께 두 번째 방문의로드 속도를 높일 수 있지만 처음 방문하는 사람은 항상 환자가되어야한다는 것을 안다.

코드 (폴리머 CLI에서 어떤 변화가)

index.html을 :

<!DOCTYPE html><html lang="en"> 
    <head> 
     <meta charset="utf-8"> 
     <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes"> 

     <title>polymer_min.</title> 
     <meta name="description" content="testing minimal loading time for Polymer app"> 

     <link rel="manifest" href="/manifest.json"> 

     <script src="/bower_components/webcomponentsjs/webcomponents-loader.js"></script> 

     <link rel="import" href="/src/polymer_min-app/polymer_min-app.html 
    </head> 
    <body> 
     <polymer_min-app></polymer_min-app> 
    </body> 
</html>

Polymer_min - 응용 프로그램은 기본적으로

<link rel="import" href="../../bower_components/polymer/polymer-element.html"> 

<dom-module id="polymer_min-app"> 
    <template> 
     <style> 
      :host { 
       display: block; 
      } 
     </style> 
     <h2>Hello [[prop1]]!</h2> 
    </template> 

    <script> 
     class Polymer_minApp extends Polymer.Element { 
      static get is() { return 'polymer_min-app'; } 
      static get properties() { 
       return { 
        prop1: { 
         type: String, 
         value: 'polymer_min-app' 
        } 
       }; 
      } 
     } 

     window.customElements.define(Polymer_minApp.is, Polymer_minApp); 
    </script> 
</dom-module>

출처

2017-11-01 MGR Programming

폴리머는 별도의 파일로 임의의 종속성을로드 로드 시간은 몇 초가 걸립니다. Dev Tools의 네트워크 탭에서 "폭포수"를 확인하십시오. 예를 들어, 우리 툴 중 하나는 시작할 때 100 개 이상의 요청을 만들어 요소와 같은 종속성을로드합니다.

서비스 작업자를 사용하지 않으면 서버 측 렌더링, 클라이언트 측 캐싱 또는 비슷하게 순차적 인 페이지로드에 필적하는로드 시간이 발생합니다.

build-directory에서 색인 파일을로드하지 않으면 응용 프로그램을 묶어도 영향을 미치지 않습니다. 종속성 (예 : bower_comonents)이 빌드의 src 하위 폴더에있는 앱 요소로 구워집니다. 그러면 코드가 필요없는 요청이 줄어들어 전송량이 줄었습니다. 위에서 언급 한 아웃 툴은 번들링으로 약 50 %의 무게를 잃어서로드시 15 번의 요청 만합니다.

샘플 이미지 https://imgur.com/a/g9UPM

독립적으로 적어도 서버를 구성하여 캐싱 알아서, 아니면 서비스 노동자를 사용해야을 묶는. NodeJS를 실행할 때 https://github.com/Polymer/prpl-server-node을 볼 수 있습니다.

출처

2017-11-02 09:47:34 OneBitAhead

좋은 사이트 인 imgur를 확인해 봤습니다. 좋은로드 성능, 두 번째로드에서의로드, 내 사이트와 동일한 문제가 3G에서 발생했습니다. –

본질적으로 느린 폴리머로드 시간

답변

관련 문제