namedwebsocket_conceptual_diagram.svg

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="946.4" height="331.2" viewBox="0, 0, 1183, 414">
  <g id="Layer_1">
    <g>
      <path d="M0.5,256.5 L461.5,256.5 L461.5,413.5 L0.5,413.5 z" fill="#DBFF80"/>
      <path d="M0.5,256.5 L461.5,256.5 L461.5,413.5 L0.5,413.5 z" fill-opacity="0" stroke="#2B2B2B" stroke-width="1"/>
    </g>
    <g>
      <path d="M722.5,256.5 L1183.5,256.5 L1183.5,413.5 L722.5,413.5 z" fill="#DBFF80"/>
      <path d="M722.5,256.5 L1183.5,256.5 L1183.5,413.5 L722.5,413.5 z" fill-opacity="0" stroke="#2B2B2B" stroke-width="1"/>
    </g>
    <g>
      <path d="M0.5,0.5 L461.5,0.5 L461.5,414.5 L0.5,414.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
      <path d="M0.5,0.5 L461.5,0.5 L461.5,414.5 L0.5,414.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
    </g>
    <path d="M29,71 L215,71 L215,185 L29,185 z" fill="url(#Gradient_1)"/>
    <path d="M29,45 L215,45 L215,71 L29,71 z" fill="#006F3F"/>
    <path d="M29.5,45.5 L215.5,45.5 L215.5,185.5 L29.5,185.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
    <text transform="matrix(1, 0, 0, 1, 113, 60)">
      <tspan x="-76" y="1" font-family="HelveticaNeue-Medium" font-size="12" fill="#FFFFFF">Web Browser 1</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 111, 31)">
      <tspan x="-103" y="-4" font-family="HelveticaNeue-Medium" font-size="24" fill="#000000">Device A</tspan>
    </text>
    <path d="M246,71 L432,71 L432,185 L246,185 z" fill="url(#Gradient_2)"/>
    <path d="M246,45 L432,45 L432,71 L246,71 z" fill="#00106F"/>
    <path d="M246.5,45.5 L432.5,45.5 L432.5,185.5 L246.5,185.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
    <text transform="matrix(1, 0, 0, 1, 330, 60)">
      <tspan x="-76" y="1" font-family="HelveticaNeue-Medium" font-size="12" fill="#FFFFFF">Native Application 1</tspan>
    </text>
    <g>
      <g>
        <path d="M37.5,82.5 L98.5,82.5 L98.5,108.5 L37.5,108.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
        <path d="M37.5,82.5 L98.5,82.5 L98.5,108.5 L37.5,108.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
      </g>
      <text transform="matrix(1, 0, 0, 1, 67.5, 95)">
        <tspan x="-22.332" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">service1</tspan>
      </text>
    </g>
    <g>
      <g>
        <path d="M254.5,81.5 L315.5,81.5 L315.5,107.5 L254.5,107.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
        <path d="M254.5,81.5 L315.5,81.5 L315.5,107.5 L254.5,107.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
      </g>
      <text transform="matrix(1, 0, 0, 1, 284.5, 94)">
        <tspan x="-22.332" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">service1</tspan>
      </text>
    </g>
    <g>
      <g>
        <path d="M110.5,82.5 L171.5,82.5 L171.5,108.5 L110.5,108.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
        <path d="M110.5,82.5 L171.5,82.5 L171.5,108.5 L110.5,108.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
      </g>
      <text transform="matrix(1, 0, 0, 1, 140.5, 95)">
        <tspan x="-22.332" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">service2</tspan>
      </text>
    </g>
    <g>
      <g>
        <path d="M327.5,81.5 L388.5,81.5 L388.5,107.5 L327.5,107.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
        <path d="M327.5,81.5 L388.5,81.5 L388.5,107.5 L327.5,107.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
      </g>
      <text transform="matrix(1, 0, 0, 1, 357.5, 94)">
        <tspan x="-22.332" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">service4</tspan>
      </text>
    </g>
    <g>
      <g>
        <path d="M327.5,134.5 L388.5,134.5 L388.5,160.5 L327.5,160.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
        <path d="M327.5,134.5 L388.5,134.5 L388.5,160.5 L327.5,160.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
      </g>
      <text transform="matrix(1, 0, 0, 1, 357.5, 147)">
        <tspan x="-22.332" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">service4</tspan>
      </text>
    </g>
    <path d="M360.5,108.5 L360.5,134.5" fill-opacity="0" stroke="#8C00C4" stroke-width="3"/>
    <text transform="matrix(1, 0, 0, 1, 131.5, 322)">
      <tspan x="-102.5" y="4" font-family="HelveticaNeue-Bold" font-size="12" fill="#9F2DCF">service4</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 99.328, 299.75)">
      <tspan x="-81.328" y="3.75" font-family="HelveticaNeue" font-size="12" fill="#000000">Local:</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 120.656, 277)">
      <tspan x="-109.656" y="4" font-family="HelveticaNeue-Bold" font-size="12" fill="#000000">Named WebSocket Service Endpoints</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 182, 374.5)">
      <tspan x="-153" y="-3.5" font-family="HelveticaNeue-Bold" font-size="12" fill="#F42401">service1</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 187, 396.5)">
      <tspan x="-158" y="-3.5" font-family="HelveticaNeue-Bold" font-size="12" fill="#AA9400">service2</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 99.328, 345)">
      <tspan x="-81.328" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">Network:</tspan>
    </text>
    <g>
      <path d="M722.5,0.5 L1183.5,0.5 L1183.5,414.5 L722.5,414.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
      <path d="M722.5,0.5 L1183.5,0.5 L1183.5,414.5 L722.5,414.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
    </g>
    <path d="M751,71 L937,71 L937,185 L751,185 z" fill="url(#Gradient_3)"/>
    <path d="M751,45 L937,45 L937,71 L751,71 z" fill="#006F3F"/>
    <path d="M751.5,45.5 L937.5,45.5 L937.5,185.5 L751.5,185.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
    <text transform="matrix(1, 0, 0, 1, 835, 60)">
      <tspan x="-76" y="1" font-family="HelveticaNeue-Medium" font-size="12" fill="#FFFFFF">Web Browser 1</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 833, 31)">
      <tspan x="-103" y="-4" font-family="HelveticaNeue-Medium" font-size="24" fill="#000000">Device B</tspan>
    </text>
    <g>
      <g>
        <path d="M759.5,82.5 L820.5,82.5 L820.5,108.5 L759.5,108.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
        <path d="M759.5,82.5 L820.5,82.5 L820.5,108.5 L759.5,108.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
      </g>
      <text transform="matrix(1, 0, 0, 1, 789.5, 95)">
        <tspan x="-22.332" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">service1</tspan>
      </text>
    </g>
    <g>
      <g>
        <path d="M832.5,82.5 L893.5,82.5 L893.5,108.5 L832.5,108.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
        <path d="M832.5,82.5 L893.5,82.5 L893.5,108.5 L832.5,108.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
      </g>
      <text transform="matrix(1, 0, 0, 1, 862.5, 95)">
        <tspan x="-22.332" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">service2</tspan>
      </text>
    </g>
    <text transform="matrix(1, 0, 0, 1, 853.5, 322)">
      <tspan x="-102.5" y="4" font-family="HelveticaNeue-Bold" font-size="12" fill="#FF4997">service3</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 821.328, 299.75)">
      <tspan x="-81.328" y="3.75" font-family="HelveticaNeue" font-size="12" fill="#000000">Local:</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 842.656, 277)">
      <tspan x="-109.656" y="4" font-family="HelveticaNeue-Bold" font-size="12" fill="#000000">Named WebSocket Service Endpoints</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 895.5, 374.5)">
      <tspan x="-144.5" y="-3.5" font-family="HelveticaNeue-Bold" font-size="12" fill="#F42401">service1</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 881.5, 396.5)">
      <tspan x="-130.5" y="-3.5" font-family="HelveticaNeue-Bold" font-size="12" fill="#AA9400">service2</tspan>
    </text>
    <text transform="matrix(1, 0, 0, 1, 821.328, 345)">
      <tspan x="-81.328" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">Network:</tspan>
    </text>
    <path d="M971,71 L1157,71 L1157,185 L971,185 z" fill="url(#Gradient_4)"/>
    <path d="M971,45 L1157,45 L1157,71 L971,71 z" fill="#006F3F"/>
    <path d="M971.5,45.5 L1157.5,45.5 L1157.5,185.5 L971.5,185.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
    <text transform="matrix(1, 0, 0, 1, 1055, 60)">
      <tspan x="-76" y="1" font-family="HelveticaNeue-Medium" font-size="12" fill="#FFFFFF">Web Browser 2</tspan>
    </text>
    <g>
      <g>
        <path d="M979.5,82.5 L1040.5,82.5 L1040.5,108.5 L979.5,108.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
        <path d="M979.5,82.5 L1040.5,82.5 L1040.5,108.5 L979.5,108.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
      </g>
      <text transform="matrix(1, 0, 0, 1, 1009.5, 95)">
        <tspan x="-22.332" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">service1</tspan>
      </text>
    </g>
    <g>
      <g>
        <path d="M759.5,134.5 L820.5,134.5 L820.5,160.5 L759.5,160.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
        <path d="M759.5,134.5 L820.5,134.5 L820.5,160.5 L759.5,160.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
      </g>
      <text transform="matrix(1, 0, 0, 1, 789.5, 147)">
        <tspan x="-22.332" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">service3</tspan>
      </text>
    </g>
    <g>
      <g>
        <path d="M979.5,134.5 L1040.5,134.5 L1040.5,160.5 L979.5,160.5 z" fill="#E7FFAA" fill-opacity="0.5"/>
        <path d="M979.5,134.5 L1040.5,134.5 L1040.5,160.5 L979.5,160.5 z" fill-opacity="0" stroke="#000000" stroke-width="2"/>
      </g>
      <text transform="matrix(1, 0, 0, 1, 1009.5, 147)">
        <tspan x="-22.332" y="3.5" font-family="HelveticaNeue" font-size="12" fill="#000000">service3</tspan>
      </text>
    </g>
    <g>
      <path d="M496.5,160.5 L691.5,160.5 L691.5,285.5 L496.5,285.5 z" fill="#AADBFF"/>
      <path d="M496.5,160.5 L691.5,160.5 L691.5,285.5 L496.5,285.5 z" fill-opacity="0" stroke="#000000" stroke-width="1"/>
    </g>
    <path d="M820.5,149.5 L979.5,148.5" fill-opacity="0" stroke="#FF2B86" stroke-width="3"/>
    <path d="M68.5,107.5 L68.5,236.5" fill-opacity="0" stroke="#EE0000" stroke-width="3"/>
    <path d="M68.5,236.5 L1065.5,236.5" fill-opacity="0" stroke="#EE0000" stroke-width="3"/>
    <path d="M284.5,107.5 L284.5,236.5" fill-opacity="0" stroke="#EE0000" stroke-width="3"/>
    <path d="M759.5,94.5 L740.5,94.5" fill-opacity="0" stroke="#EE0000" stroke-width="3"/>
    <path d="M740.5,94.5 L740.5,236.5" fill-opacity="0" stroke="#EE0000" stroke-width="3"/>
    <path d="M1065.5,236.5 L1065.5,94.5" fill-opacity="0" stroke="#EE0000" stroke-width="3"/>
    <path d="M1065.5,94.5 L1040.5,94.5" fill-opacity="0" stroke="#EE0000" stroke-width="3"/>
    <path d="M140.5,108.5 L140.5,211.5" fill-opacity="0" stroke="#CFB400" stroke-width="3"/>
    <path d="M140.5,211.5 L865.5,211.5" fill-opacity="0" stroke="#CFB400" stroke-width="3"/>
    <path d="M865.5,211.5 L865.5,108.5" fill-opacity="0" stroke="#CFB402" stroke-width="3"/>
    <text transform="matrix(1, 0, 0, 1, 593.5, 173)">
      <tspan x="-63.42" y="5" font-family="HelveticaNeue-Medium" font-size="14" fill="#000000">Local Area Network</tspan>
    </text>
  </g>
  <defs>
    <linearGradient id="Gradient_1" gradientUnits="userSpaceOnUse" x1="122" y1="71" x2="122" y2="185">
      <stop offset="0" stop-color="#8DFBA3"/>
      <stop offset="1" stop-color="#007F50"/>
    </linearGradient>
    <linearGradient id="Gradient_2" gradientUnits="userSpaceOnUse" x1="339" y1="71" x2="339" y2="185">
      <stop offset="0" stop-color="#91A7FF"/>
      <stop offset="1" stop-color="#011F82"/>
    </linearGradient>
    <linearGradient id="Gradient_3" gradientUnits="userSpaceOnUse" x1="844" y1="71" x2="844" y2="185">
      <stop offset="0" stop-color="#8DFBA3"/>
      <stop offset="1" stop-color="#007F50"/>
    </linearGradient>
    <linearGradient id="Gradient_4" gradientUnits="userSpaceOnUse" x1="1064" y1="71" x2="1064" y2="185">
      <stop offset="0" stop-color="#8DFBA3"/>
      <stop offset="1" stop-color="#007F50"/>
    </linearGradient>
  </defs>
</svg>