Critical rendering path SVG Download Free & Edit Vector by Andreas Mehlsen

Critical Rendering Path

Web Skills Flat Vectors

14.92 KB4.8 KB-68%

<?xml version="1.0" encoding="UTF-8"?>

<svg width="800px" height="800px" viewBox="0 0 73 73" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    
    <title>progressive-webapps/rendering-performance/critical-rendering-path</title>
    <desc>Created with Sketch.</desc>
    <defs>
        <rect id="path-1" x="0" y="0" width="69" height="69" rx="14">

</rect>
    </defs>
    <g id="progressive-webapps/rendering-performance/critical-rendering-path" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
        <g id="container" transform="translate(2.000000, 2.000000)">
            <rect id="mask" stroke="#555A66" stroke-width="2" fill="#FFFFFF" fill-rule="nonzero" x="-1" y="-1" width="71" height="71" rx="14">

</rect>
            <g id="street">
                <mask id="mask-2" fill="white">
                    <use xlink:href="#path-1">

</use>
                </mask>
                <rect stroke="#555A66" stroke-width="2" x="-1" y="-1" width="71" height="71" rx="14">

</rect>
                <g mask="url(#mask-2)">
                    <g transform="translate(-5.000000, -15.000000)">
                        <path d="M23.9846802,74.98703 L15.6181335,74.98703 C14.6279908,74.98703 13.825531,74.1845703 13.825531,73.1944275 L13.825531,68.0477905 C13.825531,67.4916077 14.0837097,66.9665527 14.5249939,66.6273499 L18.7080384,63.4069824 C19.3525696,62.9112243 20.2507019,62.9112243 20.8952331,63.4069824 L25.0782776,66.6273499 C25.5191041,66.9665527 25.7777405,67.4916077 25.7777405,68.0477905 L25.7777405,73.1944275 C25.7772827,74.1845703 24.974823,74.98703 23.9846802,74.98703 Z" id="Shape" fill="#FFF8AB" fill-rule="nonzero">

</path>
                        <path d="M23.9846802,74.98703 C24.974823,74.98703 25.7772827,74.1845703 25.7772827,73.1944275 L25.7772827,68.0477905 C25.7772827,67.4916077 25.5191041,66.9665527 25.0782776,66.6273499 L20.8947754,63.4069824 C20.5729675,63.1593323 20.1870728,63.0352783 19.8016357,63.0352783 L19.8016357,74.98703 L23.9846802,74.98703 Z" id="Shape" fill="#FFF04A" fill-rule="nonzero">

</path>
                        <path d="M32.9481507,95 C31.9580078,95 31.1550904,94.1970826 31.1550904,93.2073975 L31.1550904,59.6807861 C31.1550904,59.2198181 30.7801819,58.8449096 30.3192139,58.8449096 L1.79260254,58.8449096 C0.802917422,58.8449096 0,58.0419922 0,57.0518493 L0,42.9481507 C0,41.9580078 0.802917422,41.1550904 1.79260254,41.1550904 L30.3192139,41.1550904 C30.7801819,41.1550904 31.1550904,40.7801819 31.1550904,40.3192139 L31.1550904,37.0379639 C31.1550904,36.5769958 30.7801819,36.2020873 30.3192139,36.2020873 L1.79260254,36.2020873 C0.802917422,36.2020873 0,35.3991699 0,34.4090271 L0,28.5121155 C0,27.5219727 0.802917422,26.7190552 1.79260254,26.7190552 L30.3192139,26.7190552 C30.7801819,26.7190552 31.1550904,26.3441468 31.1550904,25.8831787 L31.1550904,1.79260254 C31.1550904,0.802917422 31.9580078,0 32.9481507,0 L47.0518493,0 C48.0419922,0 48.8449096,0.802917422 48.8449096,1.79260254 L48.8449096,40.3192139 C48.8449096,40.7801819 49.2198181,41.1550904 49.6807861,41.1550904 L68.2073975,41.1550904 C69.1970826,41.1550904 70,41.9580078 70,42.9481507 L70,57.0518493 C70,58.0419922 69.1970826,58.8449096 68.2073975,58.8449096 L49.6807861,58.8449096 C49.2198181,58.8449096 48.8449096,59.2198181 48.8449096,59.6807861 L48.8449096,62.9620361 C48.8449096,63.4230042 49.2198181,63.7979127 49.6807861,63.7979127 L68.2073975,63.7979127 C69.1970826,63.7979127 70,64.6008301 70,65.5909729 L70,71.4878845 C70,72.4780273 69.1970826,73.2809448 68.2073975,73.2809448 L49.6807861,73.2809448 C49.2198181,73.2809448 48.8449096,73.6558532 48.8449096,74.1168213 L48.8449096,93.2073975 C48.8449096,94.1970826 48.0419922,95 47.0518493,95 L32.9481507,95 Z" id="Shape" fill="#7E8596" fill-rule="nonzero">

</path>
                        <path d="M78.2073975,41.1550904 L49.6807861,41.1550904 C49.2198181,41.1550904 48.8449096,40.7801819 48.8449096,40.3192139 L48.8449096,1.79260254 C48.8449096,0.802917422 48.0419922,0 47.0518493,0 L39.9995423,0 L39.9995423,90 L47.0518493,90 C48.0419922,90 48.8449096,89.1970826 48.8449096,88.2073975 L48.8449096,74.1168213 C48.8449096,73.6558532 49.2198181,73.2809448 49.6807861,73.2809448 L78.2069397,73.2809448 C79.1970826,73.2809448 80,72.4780273 80,71.4878845 L80,65.5909729 C80,64.6008301 79.1970826,63.7979127 78.2069397,63.7979127 L49.6807861,63.7979127 C49.2198181,63.7979127 48.8449096,63.4230042 48.8449096,62.9620361 L48.8449096,59.6807861 C48.8449096,59.2198181 49.2198181,58.8449096 49.6807861,58.8449096 L78.2073975,58.8449096 C79.1970826,58.8449096 80,58.0419922 80,57.0518493 L80,42.9481507 C80,41.9580078 69.1970826,41.1550904 68.2073975,41.1550904 L78.2073975,41.1550904 Z" id="Shape" fill="#555A66" fill-rule="nonzero">

</path>
                        <g id="Group" stroke-width="1" fill="none" fill-rule="evenodd" transform="translate(7.000000, 48.125000)">
                            <path d="M16.2348633,3.66760254 L12.1960144,3.66760254 C11.2058716,3.66760254 10.4034118,2.864685 10.4034118,1.87454227 C10.4034118,0.884399414 11.2058716,0.0819397266 12.1960144,0.0819397266 L16.2348633,0.0819397266 C17.2250061,0.0819397266 18.0274658,0.884399414 18.0274658,1.87454227 C18.0274658,2.864685 17.2250061,3.66760254 16.2348633,3.66760254 Z" id="Shape" fill="#DCE1EB" fill-rule="nonzero">

</path>
                            <path d="M6.23486328,3.66760254 L2.19601438,3.66760254 C1.20587164,3.66760254 0.403411836,2.864685 0.403411836,1.87454227 C0.403411836,0.884399414 1.20587164,0.0819397266 2.19601438,0.0819397266 L6.23486328,0.0819397266 C7.22500613,0.0819397266 8.02746582,0.884399414 8.02746582,1.87454227 C8.02746582,2.864685 7.22500613,3.66760254 6.23486328,3.66760254 Z" id="Shape" fill="#DCE1EB" fill-rule="nonzero">

</path>
                            <path d="M25.4308777,3.66760254 L21.3920287,3.66760254 C20.401886,3.66760254 19.5994263,2.864685 19.5994263,1.87454227 C19.5994263,0.884399414 20.401886,0.0819397266 21.3920287,0.0819397266 L25.4308777,0.0819397266 C26.4210205,0.0819397266 27.2234802,0.884399414 27.2234802,1.87454227 C27.2234802,2.864685 26.4210205,3.66760254 25.4308777,3.66760254 Z" id="Shape" fill="#DCE1EB" fill-rule="nonzero">

</path>
                            <path d="M32.9995423,24.4715882 C32.0093994,24.4715882 31.2069397,23.6691284 31.2069397,22.6789856 L31.2069397,18.6401367 C31.2069397,17.6499939 32.0093994,16.8475342 32.9995423,16.8475342 C33.989685,16.8475342 34.7926025,17.6499939 34.7926025,18.6401367 L34.7926025,22.6789856 C34.7926025,23.6691284 33.989685,24.4715882 32.9995423,24.4715882 Z" id="Shape" fill="#DCE1EB" fill-rule="nonzero">

</path>
                            <path d="M32.9995423,15.2755737 C32.0093994,15.2755737 31.2069397,14.473114 31.2069397,13.4829712 L31.2069397,9.44412234 C31.2069397,8.45397949 32.0093994,7.6515198 32.9995423,7.6515198 C33.989685,7.6515198 34.7926025,8.45397949 34.7926025,9.44412234 L34.7926025,13.4829712 C34.7926025,14.473114 33.989685,15.2755737 32.9995423,15.2755737 Z" id="Shape" fill="#DCE1EB" fill-rule="nonzero">

</path>
                        </g>
                        <path d="M60.8039856,51.7930603 L56.7651367,51.7930603 C55.7749939,51.7930603 54.9725342,50.9906006 54.9725342,50.0004577 C54.9725342,49.010315 55.7749939,48.2073975 56.7651367,48.2073975 L60.8039856,48.2073975 C61.7941284,48.2073975 62.5965882,49.010315 62.5965882,50.0004577 C62.5965882,50.9906006 61.7941284,51.7930603 60.8039856,51.7930603 Z" id="Shape" fill="#BEC3D2" fill-rule="nonzero">

</path>
                        <path d="M69.8039856,51.7930603 L65.7651367,51.7930603 C64.7749939,51.7930603 63.9725342,50.9906006 63.9725342,50.0004577 C63.9725342,49.010315 64.7749939,48.2073975 65.7651367,48.2073975 L69.8039856,48.2073975 C70.7941284,48.2073975 71.5965882,49.010315 71.5965882,50.0004577 C71.5965882,50.9906006 70.7941284,51.7930603 69.8039856,51.7930603 Z" id="Shape" fill="#BEC3D2" fill-rule="nonzero">

</path>
                        <path d="M51.6079712,51.7930603 L47.5691223,51.7930603 C46.5789795,51.7930603 45.7765198,50.9906006 45.7765198,50.0004577 C45.7765198,49.010315 46.5789795,48.2073975 47.5691223,48.2073975 L51.6079712,48.2073975 C52.598114,48.2073975 53.4005737,49.010315 53.4005737,50.0004577 C53.4005737,50.9906006 52.598114,51.7930603 51.6079712,51.7930603 Z" id="Shape" fill="#BEC3D2" fill-rule="nonzero">

</path>
                        <path d="M40.0004577,35.0274658 C39.010315,35.0274658 38.2073975,34.2245483 38.2073975,33.2344055 L38.2073975,29.1960144 C38.2073975,28.2058716 39.010315,27.4029541 40.0004577,27.4029541 C40.9906006,27.4029541 41.7930603,28.2058716 41.7930603,29.1960144 L41.7930603,33.2344055 C41.7930603,34.2250061 40.9906006,35.0274658 40.0004577,35.0274658 Z" id="Shape" fill="#DCE1EB" fill-rule="nonzero">

</path>
                        <path d="M40.0004577,44.2234802 C39.010315,44.2234802 38.2073975,43.4205628 38.2073975,42.4308777 L38.2073975,38.3920287 C38.2073975,37.401886 39.010315,36.5989685 40.0004577,36.5989685 C40.9906006,36.5989685 41.7930603,37.401886 41.7930603,38.3920287 L41.7930603,42.4308777 C41.7930603,43.4205628 40.9906006,44.2234802 40.0004577,44.2234802 Z" id="Shape" fill="#DCE1EB" fill-rule="nonzero">

</path>
                        <path d="M56.0244752,38.7431335 C55.0343323,38.7431335 54.2318725,37.9402161 54.2318725,36.950531 L54.2318725,31.4720154 C54.2318725,30.4818725 55.0343323,29.6789551 56.0244752,29.6789551 C57.0146179,29.6789551 57.8175354,30.4818725 57.8175354,31.4720154 L57.8175354,36.950531 C57.8175354,37.9402161 57.0146179,38.7431335 56.0244752,38.7431335 Z" id="Shape" fill="#555A66" fill-rule="nonzero">

</path>
                        <path d="M56.0244752,33.2646179 C53.1254577,33.2646179 50.7670593,30.9062195 50.7670593,28.0072021 C50.7670593,25.1081848 53.1254577,22.7497864 56.0244752,22.7497864 C58.9234925,22.7497864 61.2818909,25.1081848 61.2818909,28.0072021 C61.2818909,30.9062195 58.9234925,33.2646179 56.0244752,33.2646179 Z" id="Shape" fill="#FF7D81" fill-rule="nonzero">

</path>
                        <path d="M62.9536438,38.7431335 C61.963501,38.7431335 61.1610413,37.9402161 61.1610413,36.950531 L61.1610413,31.4720154 C61.1610413,30.4818725 61.963501,29.6789551 62.9536438,29.6789551 C63.9437866,29.6789551 64.7467041,30.4818725 64.7467041,31.4720154 L64.7467041,36.950531 C64.7467041,37.9402161 63.9437866,38.7431335 62.9536438,38.7431335 Z" id="Shape" fill="#23272B" fill-rule="nonzero">

</path>
                        <path d="M62.9536438,33.2646179 C60.0546264,33.2646179 57.696228,30.9062195 57.696228,28.0072021 C57.696228,25.1081848 60.0546264,22.7497864 62.9536438,22.7497864 C65.8526611,22.7497864 68.2110596,25.1081848 68.2110596,28.0072021 C68.2110596,30.9062195 65.8526611,33.2646179 62.9536438,33.2646179 Z" id="Shape" fill="#FF3DA8" fill-rule="nonzero">

</path>
                        <path d="M39.9995423,64.9725342 L39.9995423,72.5965882 C40.989685,72.5965882 41.7926025,71.7941284 41.7926025,70.8039856 L41.7926025,66.7651367 C41.7926025,65.7749939 40.989685,64.9725342 39.9995423,64.9725342 Z" id="Shape" fill="#BEC3D2" fill-rule="nonzero">

</path>
                        <path d="M39.9995423,81.5965882 C39.0093994,81.5965882 38.2069397,80.7941284 38.2069397,79.8039856 L38.2069397,75.7651367 C38.2069397,74.7749939 39.0093994,73.9725342 39.9995423,73.9725342 C40.989685,73.9725342 41.7926025,74.7749939 41.7926025,75.7651367 L41.7926025,79.8039856 C41.7926025,80.7941284 40.989685,81.5965882 39.9995423,81.5965882 Z" id="Shape" fill="#DCE1EB" fill-rule="nonzero">

</path>
                        <path d="M39.9995423,73.9725342 L39.9995423,81.5965882 C40.989685,81.5965882 41.7926025,80.7941284 41.7926025,79.8039856 L41.7926025,75.7651367 C41.7926025,74.7749939 40.989685,73.9725342 39.9995423,73.9725342 Z" id="Shape" fill="#BEC3D2" fill-rule="nonzero">

</path>
                        <path d="M39.9995423,55.7765198 L39.9995423,63.4005737 C40.989685,63.4005737 41.7926025,62.598114 41.7926025,61.6079713 L41.7926025,57.5691223 C41.7926025,56.5789795 40.989685,55.7765198 39.9995423,55.7765198 Z" id="Shape" fill="#BEC3D2" fill-rule="nonzero">

</path>
                        <path d="M40.0004577,27.4029541 C40,27.4029541 40,27.4029541 39.9995423,27.4029541 L39.9995423,35.0274658 L40.0004577,35.0274658 C40.9906006,35.0274658 41.7930603,34.2245483 41.7930603,33.2344055 L41.7930603,29.1960144 C41.7930603,28.2058716 40.9906006,27.4029541 40.0004577,27.4029541 Z" id="Shape" fill="#BEC3D2" fill-rule="nonzero">

</path>
                        <path d="M40.0004577,26.0274658 C39.010315,26.0274658 38.2073975,25.2245483 38.2073975,24.2344055 L38.2073975,20.1960144 C38.2073975,19.2058716 39.010315,18.4029541 40.0004577,18.4029541 C40.9906006,18.4029541 41.7930603,19.2058716 41.7930603,20.1960144 L41.7930603,24.2344055 C41.7930603,25.2250061 40.9906006,26.0274658 40.0004577,26.0274658 Z" id="Shape" fill="#DCE1EB" fill-rule="nonzero">

</path>
                        <path d="M40.0004577,18.4029541 C40,18.4029541 40,18.4029541 39.9995423,18.4029541 L39.9995423,26.0274658 L40.0004577,26.0274658 C40.9906006,26.0274658 41.7930603,25.2245483 41.7930603,24.2344055 L41.7930603,20.1960144 C41.7930603,19.2058716 40.9906006,18.4029541 40.0004577,18.4029541 Z" id="Shape" fill="#BEC3D2" fill-rule="nonzero">

</path>
                        <path d="M40.0004577,17.0274658 C39.010315,17.0274658 38.2073975,16.2245483 38.2073975,15.2344055 L38.2073975,11.1960144 C38.2073975,10.2058716 39.010315,9.4029541 40.0004577,9.4029541 C40.9906006,9.4029541 41.7930603,10.2058716 41.7930603,11.1960144 L41.7930603,15.2344055 C41.7930603,16.2250061 40.9906006,17.0274658 40.0004577,17.0274658 Z" id="Shape" fill="#DCE1EB" fill-rule="nonzero">

</path>
                        <path d="M40.0004577,9.4029541 C40,9.4029541 40,9.4029541 39.9995423,9.4029541 L39.9995423,17.0274658 L40.0004577,17.0274658 C40.9906006,17.0274658 41.7930603,16.2245483 41.7930603,15.2344055 L41.7930603,11.1960144 C41.7930603,10.2058716 40.9906006,9.4029541 40.0004577,9.4029541 Z" id="Shape" fill="#BEC3D2" fill-rule="nonzero">

</path>
                        <path d="M40.0004577,36.5989685 C40,36.5989685 40,36.5989685 39.9995423,36.5989685 L39.9995423,44.2234802 L40.0004577,44.2234802 C40.9906006,44.2234802 41.7930603,43.4205628 41.7930603,42.4308777 L41.7930603,38.3920287 C41.7930603,37.401886 40.9906006,36.5989685 40.0004577,36.5989685 Z" id="Shape" fill="#BEC3D2" fill-rule="nonzero">

</path>
                        <path d="M18.0085755,74.98703 L18.0085755,72.1434021 C18.0085755,71.1532592 18.8114929,70.3507995 19.8016357,70.3507995 C20.7917786,70.3507995 21.5942383,71.1532592 21.5942383,72.1434021 L21.5942383,74.98703 L18.0085755,74.98703 Z" id="Shape" fill="#7E8596" fill-rule="nonzero">

</path>
                        <path d="M19.8016357,70.3507995 L19.8016357,74.98703 L21.5942383,74.98703 L21.5942383,72.1434021 C21.5942383,71.1532592 20.7917786,70.3507995 19.8016357,70.3507995 Z" id="Shape" fill="#555A66" fill-rule="nonzero">

</path>
                    </g>
                </g>
            </g>
        </g>
    </g>
</svg>

Upload

Preview React React Native PNG Data URI