SVG : 거대한 경로 대 많은 라인 태그

나는 600 + 수직선과 수평선으로 쉽게 구성 할 수있는 그리드를 그리는 중입니다.SVG : 거대한 경로 대 많은 라인 태그

지금 당장 저는 별도의 태그로 각 그리드를 생성/그리기하고 있습니다.

거대한 경로 문을 사용하여 선을 생성하면 더 나은 성능을 기대할 수 있습니까? 뭔가 이런 :

<path class="vertical half notLoaded" d="M -4256.849999999999 0 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00 v 950.00 m 52.26 -950.00"></path>

괜찮은 grafik 카드로 내 코어 i7에서 차이점을 볼 수 없습니다. 성능이 떨어지는 설정은이 설정의 이점을 줍니까?

출처

2014-11-17 AyKarsi

나는 600 개 직선은 어떤 시스템이 땀에 침입하는 원인이 있다고 생각하지 않습니다. 가장 큰 병목 현상은 아마도 네트워크 대역폭 일 것입니다. 그래서 저는 전체 격자를 하나의 ''요소에 넣고'd' 속성을 조금 덜 장황하게 만듭니다 (즉, .00과 두 자리 숫자를 구분하는 위치를 제외한 모든 공백을 제거하십시오.) –

실제로 자바 스크립트를 사용하여 클라이언트에서 요소를 생성하고 있습니다. 그래서 대역폭은 문제가되지 않습니다. – AyKarsi

그러나 클라이언트 성능면에서 단순하고 복잡한 경로가 여러 경로 사이에 차이점이 있습니까? – ManishKG

SVG의 경우 <pattern>의 예입니다. 600 개 이상의 선을 그립니다. 십자 기호가있는 상자를 그려서 타일로 붙이십시오. fill

편집 : 십자형은 선택 사항입니다. 그것은 단지 미적 학자 일뿐입니다.

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" 
 
\t width="1000" height="1000" viewBox="0 0 1000 1000" 
 
\t xml:space="preserve"> 
 
    <defs> 
 
    <pattern id="squarePattern" patternUnits="userSpaceOnUse" x="0" y="0" width="20" height="20" viewBox="0 0 20 20" > 
 
     <rect id="box" x="0" y="0" width="20" height="20" fill="none" stroke="#6185af" stroke-width="1" /> 
 
     <path d="M0,10 L20,10 M10,0 L10,20" stroke="#330066" stroke-width="1" /> 
 
    </pattern> 
 
    </defs> 
 
    <rect id="gridlines" x="0" y="0" width="1000" height="1000" fill="url(#squarePattern)" /> 
 
</svg>

출처

2014-11-17 22:35:41

SVG : 거대한 경로 대 많은 라인 태그

답변

관련 문제