<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: ADITYA VYAS</title>
    <description>The latest articles on DEV Community by ADITYA VYAS (@aditya_vyas_0cf3dbc4b96af).</description>
    <link>https://dev.to/aditya_vyas_0cf3dbc4b96af</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1625197%2Fc4346b08-7f2c-45ad-94ab-b541d48a3f99.png</url>
      <title>DEV Community: ADITYA VYAS</title>
      <link>https://dev.to/aditya_vyas_0cf3dbc4b96af</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/aditya_vyas_0cf3dbc4b96af"/>
    <language>en</language>
    <item>
      <title>GitPulse – a live 3D globe of GitHub activity</title>
      <dc:creator>ADITYA VYAS</dc:creator>
      <pubDate>Sun, 04 Oct 2026 14:04:28 +0000</pubDate>
      <link>https://dev.to/aditya_vyas_0cf3dbc4b96af/gitpulse-a-live-3d-globe-of-github-activity-4p26</link>
      <guid>https://dev.to/aditya_vyas_0cf3dbc4b96af/gitpulse-a-live-3d-globe-of-github-activity-4p26</guid>
      <description>&lt;p&gt;I kept wondering what GitHub would look like if you could &lt;em&gt;see&lt;/em&gt; it instead of reading it. So I built &lt;strong&gt;Git Pulse&lt;/strong&gt;: a live 3D globe of public GitHub activity, by city.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Live demo:&lt;/strong&gt; &lt;a href="https://gitpulse3d.vercel.app" rel="noopener noreferrer"&gt;https://gitpulse3d.vercel.app&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;You can search a city and fly there, filter by language or activity type, and replay the last 24 hours. The day/night line follows the real sun.&lt;/p&gt;

&lt;h2&gt;
  
  
  How it works
&lt;/h2&gt;

&lt;p&gt;GitHub Events API → validate → dedupe → resolve a location → aggregate into 15-minute buckets → Postgres + Redis → REST and WebSocket → React Three Fiber.&lt;/p&gt;

&lt;h2&gt;
  
  
  Surprise #1: most developers don't list a location
&lt;/h2&gt;

&lt;p&gt;I collected 1,000 real events and checked the profiles behind them. Only about &lt;strong&gt;23%&lt;/strong&gt; of the sampled profiles had a location at all, and fewer still matched a city I could place. That's why the app uses a fixed catalog of 70 cities, and why it shows a &lt;em&gt;subset&lt;/em&gt; of the world, not all of it.&lt;/p&gt;

&lt;h2&gt;
  
  
  Surprise #2: "live" isn't real-time
&lt;/h2&gt;

&lt;p&gt;The Events API is polled, not streamed. I use conditional requests (&lt;code&gt;ETag&lt;/code&gt;), follow the poll interval GitHub sends back, and retry with backoff. "Live" here means continuously updated.&lt;/p&gt;

&lt;h2&gt;
  
  
  Drawing it without melting the GPU
&lt;/h2&gt;

&lt;p&gt;All markers are one &lt;code&gt;InstancedMesh&lt;/code&gt; of 500 pooled slots, drawn in a single call. Detail changes with camera distance (80, 240 or 500 markers), so zooming out stays smooth.&lt;/p&gt;

&lt;p&gt;The day/night effect comes from real astronomy: the sun's position is computed from the date, and the replay moves it to the selected time.&lt;/p&gt;

&lt;h2&gt;
  
  
  The bugs that only showed up in production
&lt;/h2&gt;

&lt;p&gt;&lt;strong&gt;A server that kept falling asleep.&lt;/strong&gt; On Render's free tier the backend slept when idle, so visitors saw an empty globe. A cron job now pings &lt;code&gt;/health&lt;/code&gt; every 10 minutes.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Hover tooltips that worked locally and died in production.&lt;/strong&gt; three.js builds an &lt;code&gt;InstancedMesh&lt;/code&gt;'s bounding sphere on the &lt;em&gt;first raycast&lt;/em&gt; and never rebuilds it. Locally my data arrived instantly. In production the API sometimes answered after my first mouse move, so an empty sphere got cached and every later hover missed. The fix was a fixed sphere that always encloses the globe:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="nx"&gt;mesh&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nx"&gt;boundingSphere&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Sphere&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="k"&gt;new&lt;/span&gt; &lt;span class="nc"&gt;Vector3&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;0&lt;/span&gt;&lt;span class="p"&gt;),&lt;/span&gt; &lt;span class="mf"&gt;1.25&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;h2&gt;
  
  
  Privacy
&lt;/h2&gt;

&lt;p&gt;Git Pulse shows &lt;strong&gt;where, never who&lt;/strong&gt;: city-level activity only, no usernames, no repositories.&lt;/p&gt;

&lt;h2&gt;
  
  
  Try it
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://gitpulse3d.vercel.app" rel="noopener noreferrer"&gt;https://gitpulse3d.vercel.app&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I'd love feedback, especially on the location matching. Where is your code being built?&lt;/p&gt;

</description>
      <category>showdev</category>
      <category>threejs</category>
      <category>webdev</category>
      <category>react</category>
    </item>
  </channel>
</rss>
