76 lines
5.5 KiB
XML
76 lines
5.5 KiB
XML
<?xml version="1.0" encoding="UTF-8"?>
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 720 1120" role="img" aria-labelledby="title desc">
|
|
<title id="title">Webpack 4: от двух entry к общему модулю</title>
|
|
<desc id="desc">Вертикальный граф показывает, как entry site и admin достигают собственных модулей и затем общих зависимостей date-format и jquery.</desc>
|
|
<defs>
|
|
<linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
|
|
<stop offset="0%" stop-color="#fffaf3"/>
|
|
<stop offset="100%" stop-color="#f3f7ff"/>
|
|
</linearGradient>
|
|
<marker id="arrow" markerWidth="10" markerHeight="10" refX="8" refY="5" orient="auto">
|
|
<path d="M0,0 L10,5 L0,10 z" fill="#6c7280"/>
|
|
</marker>
|
|
<filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
|
|
<feDropShadow dx="0" dy="6" stdDeviation="8" flood-color="#253858" flood-opacity="0.12"/>
|
|
</filter>
|
|
</defs>
|
|
<rect width="720" height="1120" rx="28" fill="url(#bg)"/>
|
|
<text x="40" y="62" fill="#14213d" font-family="Arial, sans-serif" font-size="31" font-weight="700">От entry к графу</text>
|
|
<text x="40" y="98" fill="#516079" font-family="Arial, sans-serif" font-size="20">Общий исходник достижим</text>
|
|
<text x="40" y="124" fill="#516079" font-family="Arial, sans-serif" font-size="20">из двух независимых стартов.</text>
|
|
|
|
<g filter="url(#shadow)">
|
|
<rect x="40" y="174" width="300" height="132" rx="18" fill="#ffffff" stroke="#bcd3e7"/>
|
|
<rect x="40" y="174" width="300" height="35" rx="18" fill="#d9eaff"/>
|
|
<text x="62" y="198" fill="#255a9b" font-family="Arial, sans-serif" font-size="16" font-weight="700">ENTRY 1</text>
|
|
<text x="62" y="254" fill="#14213d" font-family="Arial, sans-serif" font-size="29" font-weight="700">site.js</text>
|
|
<text x="62" y="283" fill="#516079" font-family="Arial, sans-serif" font-size="17">сценарий обычной страницы</text>
|
|
</g>
|
|
<g filter="url(#shadow)">
|
|
<rect x="380" y="174" width="300" height="132" rx="18" fill="#ffffff" stroke="#bcd3e7"/>
|
|
<rect x="380" y="174" width="300" height="35" rx="18" fill="#e9dcff"/>
|
|
<text x="402" y="198" fill="#6542a1" font-family="Arial, sans-serif" font-size="16" font-weight="700">ENTRY 2</text>
|
|
<text x="402" y="254" fill="#14213d" font-family="Arial, sans-serif" font-size="29" font-weight="700">admin.js</text>
|
|
<text x="402" y="283" fill="#516079" font-family="Arial, sans-serif" font-size="17">сценарий панели</text>
|
|
</g>
|
|
|
|
<path d="M190 306 V354" fill="none" stroke="#255a9b" stroke-width="4" marker-end="url(#arrow)"/>
|
|
<path d="M530 306 V354" fill="none" stroke="#6542a1" stroke-width="4" marker-end="url(#arrow)"/>
|
|
|
|
<g filter="url(#shadow)">
|
|
<rect x="40" y="354" width="300" height="130" rx="18" fill="#ffffff" stroke="#c9d6e8"/>
|
|
<text x="62" y="410" fill="#14213d" font-family="Arial, sans-serif" font-size="24" font-weight="700">site/search.js</text>
|
|
<text x="62" y="444" fill="#516079" font-family="Arial, sans-serif" font-size="17">нужен только site</text>
|
|
</g>
|
|
<g filter="url(#shadow)">
|
|
<rect x="380" y="354" width="300" height="130" rx="18" fill="#ffffff" stroke="#c9d6e8"/>
|
|
<text x="402" y="410" fill="#14213d" font-family="Arial, sans-serif" font-size="24" font-weight="700">admin/report.js</text>
|
|
<text x="402" y="444" fill="#516079" font-family="Arial, sans-serif" font-size="17">нужен только admin</text>
|
|
</g>
|
|
|
|
<path d="M190 484 V538 H360 V570" fill="none" stroke="#255a9b" stroke-width="4" marker-end="url(#arrow)"/>
|
|
<path d="M530 484 V538 H360 V570" fill="none" stroke="#6542a1" stroke-width="4" marker-end="url(#arrow)"/>
|
|
|
|
<g filter="url(#shadow)">
|
|
<rect x="40" y="570" width="640" height="150" rx="18" fill="#ffffff" stroke="#b8dcc8" stroke-width="2"/>
|
|
<rect x="40" y="570" width="640" height="35" rx="18" fill="#d8f1e2"/>
|
|
<text x="66" y="594" fill="#226b46" font-family="Arial, sans-serif" font-size="16" font-weight="700">ОБЩИЙ ИСХОДНИК</text>
|
|
<text x="66" y="653" fill="#14213d" font-family="Arial, sans-serif" font-size="29" font-weight="700">shared/date-format.js</text>
|
|
<text x="66" y="688" fill="#516079" font-family="Arial, sans-serif" font-size="18">кандидат для common, если отдельный запрос оправдан</text>
|
|
</g>
|
|
|
|
<path d="M360 720 V766" fill="none" stroke="#6c7280" stroke-width="4" marker-end="url(#arrow)"/>
|
|
|
|
<g filter="url(#shadow)">
|
|
<rect x="40" y="766" width="640" height="150" rx="18" fill="#ffffff" stroke="#e6d093"/>
|
|
<rect x="40" y="766" width="640" height="35" rx="18" fill="#f6e8c3"/>
|
|
<text x="66" y="790" fill="#8a5a00" font-family="Arial, sans-serif" font-size="16" font-weight="700">ВНЕШНИЙ ПАКЕТ</text>
|
|
<text x="66" y="849" fill="#14213d" font-family="Arial, sans-serif" font-size="29" font-weight="700">jquery</text>
|
|
<text x="66" y="884" fill="#516079" font-family="Arial, sans-serif" font-size="18">кандидат для vendors при двух entry</text>
|
|
</g>
|
|
|
|
<rect x="40" y="980" width="640" height="96" rx="16" fill="#14213d"/>
|
|
<text x="66" y="1018" fill="#ffffff" font-family="Arial, sans-serif" font-size="20" font-weight="700">Важная граница</text>
|
|
<text x="66" y="1051" fill="#ffffff" font-family="Arial, sans-serif" font-size="18">Общий файл на диске не гарантирует общий chunk в сборке.</text>
|
|
</svg>
|