<?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>Forem: Mehdi Amrane</title>
    <description>The latest articles on Forem by Mehdi Amrane (@mehdi).</description>
    <link>https://forem.com/mehdi</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.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F363914%2F09b70733-32b2-48d1-80e2-a4dc0265bf47.jpeg</url>
      <title>Forem: Mehdi Amrane</title>
      <link>https://forem.com/mehdi</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://forem.com/feed/mehdi"/>
    <language>en</language>
    <item>
      <title>BrightMentions: Building a 24/7 Brand Monitoring AI Agent with n8n and Bright Data</title>
      <dc:creator>Mehdi Amrane</dc:creator>
      <pubDate>Mon, 01 Sep 2025 06:55:41 +0000</pubDate>
      <link>https://forem.com/mehdi/brightmentions-building-a-247-brand-monitoring-ai-agent-with-n8n-and-bright-data-3gg</link>
      <guid>https://forem.com/mehdi/brightmentions-building-a-247-brand-monitoring-ai-agent-with-n8n-and-bright-data-3gg</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for the &lt;a href="https://dev.to/challenges/brightdata-n8n-2025-08-13"&gt;AI Agents Challenge powered by n8n and Bright Data&lt;/a&gt;&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Built
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0fhc7sliu28s6eoms5zm.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F0fhc7sliu28s6eoms5zm.png" alt="BrightMentions report screenshot"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;I built an intelligent &lt;strong&gt;Brand and Keyword Mention Monitoring Agent&lt;/strong&gt; that runs every 2 hours, searching the web for brand mentions and delivering curated reports directly to your inbox. It's essentially a tireless assistant that can process hundreds of posts while you sleep, filtering out the noise and highlighting what actually matters.&lt;/p&gt;

&lt;p&gt;The core problem this solves: manual brand monitoring is both overwhelming and incomplete. You're either drowning in irrelevant mentions or missing important conversations entirely. This agent finds the sweet spot between comprehensive coverage and actionable insights.&lt;/p&gt;

&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;p&gt;&lt;iframe src="https://player.vimeo.com/video/1114774518" width="710" height="399"&gt;
&lt;/iframe&gt;
 &lt;/p&gt;

&lt;p&gt;The system processes hundreds of potential mentions autonomously, delivering only the most relevant insights through formatted email reports.&lt;/p&gt;

&lt;h3&gt;
  
  
  n8n Workflow
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F19q7b5xemlrvp0nt4sg8.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F19q7b5xemlrvp0nt4sg8.png" alt="Workflow screenshot"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Complete workflow available here: &lt;a href="https://gist.github.com/mehdiamrane/04767081a0aa4cadb677e7822c3e9fef" rel="noopener noreferrer"&gt;N8N BrightMentions Workflow JSON&lt;/a&gt;&lt;/p&gt;

&lt;h3&gt;
  
  
  Setup Guide
&lt;/h3&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Import &amp;amp; Clone&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Import the workflow JSON into your n8n instance&lt;/li&gt;
&lt;li&gt;Clone &lt;a href="https://airtable.com/appGP9dV5j2WL6zUt/shrVqcD9xgdoHkBUS" rel="noopener noreferrer"&gt;this Airtable database&lt;/a&gt; to your account&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Connect Your Services&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Airtable&lt;/strong&gt;: Create a token for your BrightMentions database&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Bright Data&lt;/strong&gt;: Connect your account and create two zones: &lt;code&gt;serp_api1&lt;/code&gt; and &lt;code&gt;web_unlocker1&lt;/code&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;OpenRouter&lt;/strong&gt;: Add your API credentials (recommended for rate limit flexibility)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;SMTP&lt;/strong&gt;: Configure email credentials for notifications&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;&lt;strong&gt;Configure Your Settings&lt;/strong&gt;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Follow the yellow notes in the workflow&lt;/li&gt;
&lt;li&gt;Set your keywords, exclusion URLs, and email recipients in Airtable&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Activate the workflow and monitoring begins automatically.&lt;/p&gt;

&lt;h2&gt;
  
  
  Technical Implementation
&lt;/h2&gt;

&lt;h3&gt;
  
  
  AI Agent Configuration
&lt;/h3&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fl5y0yo6vmblv9hqw6ilq.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fl5y0yo6vmblv9hqw6ilq.png" alt="AI Agent Screenshot"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;System Instructions&lt;/strong&gt;: The heart of this system is a prompt that transforms the AI into a specialized mention analysis expert. Rather than generic sentiment analysis, the agent understands the context, urgency levels, and response strategies. It evaluates mentions across multiple dimensions: sentiment intensity, potential impact, author influence, and recommended actions.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Model Choice&lt;/strong&gt;: I specifically chose OpenAI's GPT-4.1 mini and nano models via OpenRouter for two key reasons:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Massive context windows&lt;/strong&gt;: These models can handle extremely long extracted content without hitting token limits, which is crucial when analyzing detailed social media posts or lengthy articles&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;No rate limiting on OpenRouter&lt;/strong&gt;: Unlike direct API access, this ensures the workflow never stalls due to request limits during high-volume processing periods&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;Memory&lt;/strong&gt;: This agent operates statelessly by design. Each mention analysis is independent, with all necessary context provided in the prompt. This approach ensures consistency and eliminates potential memory-related errors in automated workflows.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Tools&lt;/strong&gt;: The agent uses n8n's &lt;strong&gt;Structured Output Parser&lt;/strong&gt; to ensure the AI returns properly formatted JSON responses. This tool validates the output format and prevents parsing errors that could break the downstream workflow. All mention analysis happens within a single, comprehensive system instruction that guides the AI through structured evaluation processes.&lt;/p&gt;

&lt;p&gt;The prompt instructs the agent to return structured JSON output covering sentiment, urgency classification, impact assessment, and specific response recommendations, essentially turning raw mentions into actionable data.&lt;/p&gt;

&lt;h3&gt;
  
  
  Bright Data Verified Node
&lt;/h3&gt;

&lt;p&gt;Bright Data makes the "unstoppable" part of this workflow actually work. Instead of building and maintaining scrapers for dozens of platforms, I leverage their pre-built solutions that handle the complexity for me.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Pre-built Scrapers&lt;/strong&gt;: The system uses 18 different Bright Data verified scrapers covering major platforms:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Social networks: X, Instagram, Facebook, LinkedIn, TikTok, BlueSky&lt;/li&gt;
&lt;li&gt;Content platforms: YouTube, Pinterest, Reddit&lt;/li&gt;
&lt;li&gt;Professional networks: LinkedIn&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;&lt;strong&gt;SERP API Integration&lt;/strong&gt;: Clean, structured Google search results without dealing with CAPTCHAs or anti-bot measures. The &lt;code&gt;serp_api&lt;/code&gt; zone handles search queries with time filters and exclusions seamlessly.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Web Unlocker&lt;/strong&gt;: For any URL that doesn't fit pre-built scrapers, the Web Unlocker extracts content from virtually any website, bypassing anti-bot protections automatically.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Batch Processing&lt;/strong&gt;: The workflow uses snapshot IDs for efficient parallel processing. Submit multiple URLs, receive a snapshot ID, then poll for completion - this approach scales naturally as monitoring requirements grow.&lt;/p&gt;

&lt;p&gt;The reliability here is what sets this apart from DIY scraping solutions. When Instagram changes their layout, Bright Data's scrapers adapt automatically. When a site implements new bot detection, the Web Unlocker handles it transparently.&lt;/p&gt;

&lt;h2&gt;
  
  
  Journey
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Key Challenges
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;The Keyword Ambiguity Problem&lt;/strong&gt;&lt;br&gt;
Initial versions captured every mention of a keyword regardless of context. Monitoring "n8n" would return results about random abbreviations, postal codes, basically anything containing those three letters in sequence.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Solution&lt;/em&gt;: Context-aware filtering. The system scrapes context URLs to understand what each keyword actually represents, then uses AI to filter search results before expensive content extraction begins.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;URL Routing Complexity&lt;/strong&gt;&lt;br&gt;
Initially built routing with switch cases to direct URLs to appropriate scrapers. Problem: some URLs failed with Web Unlocker but worked perfectly with pre-built scrapers, creating unpredictable extraction failures.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Solution&lt;/em&gt;: Migrated to regex-based routing that intelligently categorizes URLs and automatically selects the optimal extraction method. Much cleaner and handles edge cases seamlessly.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Reliability at Scale&lt;/strong&gt;&lt;br&gt;
Web scraping fails frequently, even with robust infrastructure. Early versions would crash when individual requests failed, losing entire batches of data.&lt;/p&gt;

&lt;p&gt;&lt;em&gt;Solution&lt;/em&gt;: Comprehensive error handling with email notifications. Failed extractions are logged and reported, while successful ones continue processing. This provides visibility into problematic domains while maintaining system resilience.&lt;/p&gt;

&lt;h3&gt;
  
  
  Technical Insights
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Context is everything&lt;/strong&gt;: The difference between useful monitoring and spam is understanding what you're actually looking for. Automated context extraction from URLs transformed accuracy dramatically.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Smart routing matters&lt;/strong&gt;: Categorizing URLs and directing them to appropriate extraction methods (pre-built scrapers vs. Web Unlocker) optimizes both speed and reliability.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Simple architectures scale better&lt;/strong&gt;: Using stateless AI analysis rather than complex memory systems keeps the workflow maintainable and predictable.&lt;/p&gt;

&lt;h3&gt;
  
  
  Results
&lt;/h3&gt;

&lt;p&gt;The system delivers measurable improvements over manual monitoring:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Comprehensive coverage&lt;/strong&gt;: 24/7 monitoring across all major platforms&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;High accuracy&lt;/strong&gt;: Context-aware filtering eliminates irrelevant mentions&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Cost efficiency&lt;/strong&gt;: Pay-per-use pricing scales with actual monitoring needs&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Zero maintenance&lt;/strong&gt;: Bright Data handles platform changes automatically&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Actionable insights&lt;/strong&gt;: AI analysis provides response recommendations, not just raw data&lt;/li&gt;
&lt;/ul&gt;

</description>
      <category>devchallenge</category>
      <category>n8nbrightdatachallenge</category>
      <category>ai</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Redis Place: Building r/place with 9 Redis Data Structures</title>
      <dc:creator>Mehdi Amrane</dc:creator>
      <pubDate>Mon, 11 Aug 2025 06:59:20 +0000</pubDate>
      <link>https://forem.com/mehdi/redis-place-building-rplace-with-9-redis-data-structures-3lj8</link>
      <guid>https://forem.com/mehdi/redis-place-building-rplace-with-9-redis-data-structures-3lj8</guid>
      <description>&lt;p&gt;&lt;em&gt;This is a submission for the &lt;a href="https://dev.to/challenges/redis-2025-07-23"&gt;Redis AI Challenge&lt;/a&gt;: Beyond the Cache&lt;/em&gt;.&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Built
&lt;/h2&gt;

&lt;p&gt;Redis Place is a collaborative pixel art canvas inspired by Reddit's r/place, where users can paint on a shared 1000x1000 canvas in real-time. But here's the twist: &lt;strong&gt;every single feature is powered by Redis as the primary database&lt;/strong&gt; - no traditional database in sight!&lt;/p&gt;

&lt;p&gt;What makes this project special:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;🎨 &lt;strong&gt;Real-time collaboration&lt;/strong&gt; with instant pixel updates across all users&lt;/li&gt;
&lt;li&gt;📊 &lt;strong&gt;Advanced analytics dashboard&lt;/strong&gt; with live user leaderboards and activity feeds&lt;/li&gt;
&lt;li&gt;🔄 &lt;strong&gt;Time-travel replay system&lt;/strong&gt; to watch the canvas evolve from the first pixel&lt;/li&gt;
&lt;li&gt;🗺️ &lt;strong&gt;Activity heatmaps&lt;/strong&gt; showing hot zones across different time ranges&lt;/li&gt;
&lt;li&gt;🏆 &lt;strong&gt;Achievement system&lt;/strong&gt; with automated badge awarding&lt;/li&gt;
&lt;li&gt;⚡ &lt;strong&gt;Ultra-optimized performance&lt;/strong&gt; with Redis pipelines and intelligent caching&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;The entire application demonstrates Redis capabilities far beyond caching - it's a comprehensive data platform handling everything from pixel storage to user authentication, analytics, and real-time messaging.&lt;/p&gt;

&lt;h2&gt;
  
  
  Tech Stack
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;Frontend: Vite + React&lt;/li&gt;
&lt;li&gt;Backend: Node.js + Socket.io + Redis 8&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Demo
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;🚀 &lt;strong&gt;Live Demo&lt;/strong&gt;: &lt;a href="https://redisplace.mehdi.co/" rel="noopener noreferrer"&gt;https://redisplace.mehdi.co/&lt;/a&gt;
&lt;/li&gt;
&lt;li&gt;🐙 &lt;strong&gt;Source Code&lt;/strong&gt;: &lt;a href="https://github.com/mehdiamrane/redis-place" rel="noopener noreferrer"&gt;https://github.com/mehdiamrane/redis-place&lt;/a&gt;
&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  ASMR Demo Video
&lt;/h2&gt;

&lt;p&gt;&lt;iframe src="https://player.vimeo.com/video/1108966436" width="710" height="399"&gt;
&lt;/iframe&gt;
&lt;/p&gt;

&lt;h3&gt;
  
  
  Key Features Showcase:
&lt;/h3&gt;

&lt;p&gt;&lt;strong&gt;Main Canvas:&lt;/strong&gt;&lt;br&gt;
&lt;em&gt;Real-time collaborative pixel art&lt;/em&gt;&lt;br&gt;
&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8mz5x4ebc3m3125mnt94.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8mz5x4ebc3m3125mnt94.png" alt="Canvas Screenshot"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Time-Travel Replay:&lt;/strong&gt;&lt;br&gt;
&lt;em&gt;Watch the canvas evolve over time with chronological event reconstruction&lt;/em&gt;&lt;br&gt;
&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fc7vup09321xiuu4tx910.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fc7vup09321xiuu4tx910.png" alt="Replay Screenshot"&gt;&lt;/a&gt; &lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Activity Heatmap:&lt;/strong&gt;&lt;br&gt;
&lt;em&gt;Visual overlay showing activity hot zones with time-based filtering&lt;/em&gt;&lt;br&gt;
&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqpnlku4lftgdx4tga204.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fqpnlku4lftgdx4tga204.png" alt="Heatmap Screenshot"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Analytics Dashboard:&lt;/strong&gt;&lt;br&gt;
&lt;em&gt;User leaderboards, statistics, and activity feed&lt;/em&gt;&lt;br&gt;
&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8azbusngvax4tus19dpo.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F8azbusngvax4tus19dpo.png" alt="Analytics Screenshot"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;User Profile:&lt;/strong&gt;&lt;br&gt;
&lt;em&gt;User profile with statistics and badges&lt;/em&gt;&lt;br&gt;
&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F9sa4v60j3b8i0gw1wpoj.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F9sa4v60j3b8i0gw1wpoj.png" alt="User Profile"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  How I Used 9 Redis Data Structures in Redis 8
&lt;/h2&gt;

&lt;p&gt;This project pushes Redis beyond caching into &lt;strong&gt;primary database territory&lt;/strong&gt;, leveraging 9 different Redis data structures to create a feature-rich collaborative application:&lt;/p&gt;

&lt;h3&gt;
  
  
  1. 🔢 &lt;strong&gt;Bitfields: Ultra-Efficient Pixel Storage&lt;/strong&gt;
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Store 1M pixels in just 625KB using 5-bit encoding per pixel&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;bitOffset&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;y&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; &lt;span class="mi"&gt;1000&lt;/span&gt; &lt;span class="o"&gt;+&lt;/span&gt; &lt;span class="nx"&gt;x&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="o"&gt;*&lt;/span&gt; &lt;span class="mi"&gt;5&lt;/span&gt;&lt;span class="p"&gt;;&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;bitfield&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;canvas:pixels&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;SET&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;u5&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;bitOffset&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;colorId&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Challenge&lt;/strong&gt;: Store 1M pixels efficiently&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Solution&lt;/strong&gt;: Each pixel uses 5 bits (32 color IDs), reducing memory from ~4MB to 625KB&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Impact&lt;/strong&gt;: 85% memory reduction with instant pixel access&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  2. 📡 &lt;strong&gt;Pub/Sub: Real-Time Collaboration&lt;/strong&gt;
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Instant pixel updates across all connected users&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;publish&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;canvas:updates&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;JSON&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;stringify&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt; &lt;span class="nx"&gt;x&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;y&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;color&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;userId&lt;/span&gt; &lt;span class="p"&gt;}));&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Real-time broadcasting&lt;/strong&gt; of pixel changes to all connected clients&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Decoupled architecture&lt;/strong&gt; separating storage from notifications&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Instant synchronization&lt;/strong&gt; across unlimited concurrent users&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  3. 🏆 &lt;strong&gt;Sorted Sets: Dynamic Leaderboards&lt;/strong&gt;
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Increment user's pixel count&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;zincrby&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;leaderboard:users&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;userId&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="c1"&gt;// Get top 10 users with most pixels&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;topUsers&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;zrevrange&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;leaderboard:users&lt;/span&gt;&lt;span class="dl"&gt;"&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;9&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;WITHSCORES&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Automatic ranking&lt;/strong&gt; without complex sorting algorithms&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Efficient range queries&lt;/strong&gt; for top N users&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Real-time score updates&lt;/strong&gt; with each pixel placement&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  4. 📊 &lt;strong&gt;HyperLogLog: Probabilistic Analytics&lt;/strong&gt;
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Add user ID to daily visitor set&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;pfadd&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;`visitors:daily:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;date&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;userId&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="c1"&gt;// Count unique daily visitors with constant memory&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;uniqueVisitors&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;pfcount&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;`visitors:daily:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;date&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Memory-efficient counting&lt;/strong&gt; of unique values&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Daily visitor tracking&lt;/strong&gt; with minimal overhead&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  5. 🌊 &lt;strong&gt;Streams: Event Sourcing &amp;amp; Time Travel&lt;/strong&gt;
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Complete event history for replay feature&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;xadd&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;stream:activity&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;*&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;userId&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;userId&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;x&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;x&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;y&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;y&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;color&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;color&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="c1"&gt;// Time-based filtering for canvas replay&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;events&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;xrange&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;stream:activity&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;startTime&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;endTime&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Complete event history&lt;/strong&gt; for every pixel placement&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Time-based filtering&lt;/strong&gt; using native Redis timestamps&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Canvas reconstruction&lt;/strong&gt; by replaying events chronologically&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  6. 🗃️ &lt;strong&gt;JSON Documents: Rich User Profiles and Rate Limiting&lt;/strong&gt;
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Structured user data with atomic updates&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;call&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;JSON.SET&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="s2"&gt;`userprofile:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;userId&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;$&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
  &lt;span class="nx"&gt;JSON&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;stringify&lt;/span&gt;&lt;span class="p"&gt;({&lt;/span&gt;
    &lt;span class="na"&gt;pixelsPlaced&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;150&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt;
    &lt;span class="na"&gt;favoriteColor&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="nf"&gt;calculateFavorite&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;colorUsage&lt;/span&gt;&lt;span class="p"&gt;),&lt;/span&gt;
    &lt;span class="na"&gt;colorUsage&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;1&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;45&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;5&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;30&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;12&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="mi"&gt;15&lt;/span&gt; &lt;span class="p"&gt;},&lt;/span&gt;
    &lt;span class="na"&gt;badges&lt;/span&gt;&lt;span class="p"&gt;:&lt;/span&gt; &lt;span class="p"&gt;[&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;first_pixel&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;color_master&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;],&lt;/span&gt;
  &lt;span class="p"&gt;})&lt;/span&gt;
&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="c1"&gt;// Rate limiting using JSON profiles&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;profileData&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;call&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;JSON.GET&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;profileKey&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;$.lastPixelTime&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="k"&gt;if &lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;timeSinceLastPixel&lt;/span&gt; &lt;span class="o"&gt;&amp;lt;&lt;/span&gt; &lt;span class="nx"&gt;backendCooldownMs&lt;/span&gt;&lt;span class="p"&gt;)&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt;
  &lt;span class="nx"&gt;socket&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;emit&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;rate-limited&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="p"&gt;{&lt;/span&gt; &lt;span class="nx"&gt;remainingSeconds&lt;/span&gt; &lt;span class="p"&gt;});&lt;/span&gt;
&lt;span class="p"&gt;}&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Atomic profile updates&lt;/strong&gt; in a single operation&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Complex data structures&lt;/strong&gt; with nested objects and arrays&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Automatic favorite color calculation&lt;/strong&gt; from usage patterns&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Badge system integration&lt;/strong&gt; with real-time achievements&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Rate limiting&lt;/strong&gt; using JSON profiles with lastPixelTime field&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  7. ⏱️ &lt;strong&gt;Time Series: Activity Heatmaps&lt;/strong&gt;
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Track activity zones with time-based aggregation&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;call&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;TS.CREATE&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s2"&gt;`heatmap:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;zoneX&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;zoneY&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;RETENTION&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;604800000&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;call&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;TS.ADD&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s2"&gt;`heatmap:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;zoneX&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;zoneY&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nb"&gt;Date&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;now&lt;/span&gt;&lt;span class="p"&gt;(),&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="c1"&gt;// Query with time ranges for dynamic heatmaps&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;activity&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;call&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;TS.RANGE&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="s2"&gt;`heatmap:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;x&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;y&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;fromTime&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;+&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;400-zone grid&lt;/strong&gt; tracking (400 areas of 50x50 pixels zones across 1000x1000 pixels canvas)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;7-day retention&lt;/strong&gt; with automatic expiration&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Pipeline optimization&lt;/strong&gt; reducing 30s queries to 180ms&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;5-minute caching&lt;/strong&gt; further improving performance to 90ms when cache hits&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  8. 🗂️ &lt;strong&gt;Hashes: Authentication &amp;amp; Statistics&lt;/strong&gt;
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Storing user credentials&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;hset&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;`user:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;username&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;password&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;bcryptHash&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;createdAt&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;timestamp&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="c1"&gt;// Incrementing global color usage statistics&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;hincrby&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;stats:colors&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;colorId&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;1&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Secure credential storage&lt;/strong&gt; with bcrypt hashing&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Global color statistics&lt;/strong&gt; with atomic increments&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Efficient field-based operations&lt;/strong&gt; for related data&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  9. 🎯 &lt;strong&gt;Strings: Intelligent Caching and Session Management&lt;/strong&gt;
&lt;/h3&gt;



&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight typescript"&gt;&lt;code&gt;&lt;span class="c1"&gt;// Event-driven cache invalidation&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;set&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;canvas:snapshot:cache&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;JSON&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;stringify&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="nx"&gt;snapshot&lt;/span&gt;&lt;span class="p"&gt;));&lt;/span&gt;
&lt;span class="c1"&gt;// Clear on pixel changes&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;del&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="s2"&gt;canvas:snapshot:cache&lt;/span&gt;&lt;span class="dl"&gt;"&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;

&lt;span class="c1"&gt;// 30-day sliding sessions with automatic renewal&lt;/span&gt;
&lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;setex&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;`session:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;token&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="mi"&gt;2592000&lt;/span&gt;&lt;span class="p"&gt;,&lt;/span&gt; &lt;span class="nx"&gt;username&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;span class="c1"&gt;// Validate session against logged-in username&lt;/span&gt;
&lt;span class="kd"&gt;const&lt;/span&gt; &lt;span class="nx"&gt;username&lt;/span&gt; &lt;span class="o"&gt;=&lt;/span&gt; &lt;span class="k"&gt;await&lt;/span&gt; &lt;span class="nx"&gt;redis&lt;/span&gt;&lt;span class="p"&gt;.&lt;/span&gt;&lt;span class="nf"&gt;get&lt;/span&gt;&lt;span class="p"&gt;(&lt;/span&gt;&lt;span class="s2"&gt;`session:&lt;/span&gt;&lt;span class="p"&gt;${&lt;/span&gt;&lt;span class="nx"&gt;sessionToken&lt;/span&gt;&lt;span class="p"&gt;}&lt;/span&gt;&lt;span class="s2"&gt;`&lt;/span&gt;&lt;span class="p"&gt;);&lt;/span&gt;
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Smart cache invalidation&lt;/strong&gt; only when canvas changes&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Race condition handling&lt;/strong&gt; with polling mechanisms&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Performance boost&lt;/strong&gt;: 4s generation → instant cached loads&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Sliding expiration&lt;/strong&gt; for sessions, refreshed on activity&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Performance Optimizations That Matter
&lt;/h2&gt;

&lt;h3&gt;
  
  
  Canvas Loading: 500x Performance Improvement
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Before&lt;/strong&gt;: 20+ seconds for full canvas load&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;After&lt;/strong&gt;: 4 seconds (first load), instant (cached)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Technique&lt;/strong&gt;: 50K-operation pipelines (50k operations max. to prevent stack overflow) + intelligent Redis caching&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Heatmap Queries: 165x Faster
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Before&lt;/strong&gt;: 30 seconds for 400 zone queries&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;After&lt;/strong&gt;: 180ms (pipelines) → 90ms (with cache)&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Technique&lt;/strong&gt;: Pipeline batching + 5-minute Redis cache layer&lt;/li&gt;
&lt;/ul&gt;

&lt;h3&gt;
  
  
  Canvas Storage Efficiency: 85% Reduction
&lt;/h3&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Traditional approach&lt;/strong&gt;: ~4MB for 1M pixels&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Bitfield approach&lt;/strong&gt;: 625KB for same data&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Bonus&lt;/strong&gt;: Room for 32 color states because of 5-bit encoding&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Conclusion - Redis is not just a cache
&lt;/h2&gt;

&lt;p&gt;This project proves Redis isn't just a cache - it's a complete data platform:&lt;/p&gt;

&lt;p&gt;✅ &lt;strong&gt;Primary Database&lt;/strong&gt;: No other database needed&lt;br&gt;&lt;br&gt;
✅ &lt;strong&gt;Real-Time Engine&lt;/strong&gt;: Pub/Sub for instant collaboration&lt;br&gt;&lt;br&gt;
✅ &lt;strong&gt;Analytics Platform&lt;/strong&gt;: Multiple data structures for complex queries&lt;br&gt;&lt;br&gt;
✅ &lt;strong&gt;Event Store&lt;/strong&gt;: Complete history with Streams&lt;br&gt;&lt;br&gt;
✅ &lt;strong&gt;Session Store&lt;/strong&gt;: Secure authentication with sliding expiration&lt;/p&gt;

</description>
      <category>redischallenge</category>
      <category>devchallenge</category>
      <category>database</category>
      <category>ai</category>
    </item>
  </channel>
</rss>
