MAP DXB
Production real estate platform (UAE market)
THE CHALLENGE
Building a real estate platform for the UAE market requires handling large property datasets with heavy images, multilingual support (EN/AR), and fast filtering while maintaining performance across devices.
TECH STACK
Engineering Approach
Frontend Architecture Planning
Engineered the complete frontend architecture with focus on image-heavy listing pages and dynamic filtering capabilities.
API-Driven State Management
Integrated with backend API using structured state management to ensure predictable UI updates as property data changes.
Multilingual Infrastructure
Implemented proper i18n routing for English and Arabic with RTL support and URL structure considerations.
Performance Optimization
Applied image optimization, lazy loading, and code splitting to maintain fast browsing despite large media assets.
Key Technical Decisions
The choices that shaped the architecture and determined long-term maintainability.
Next.js for SEO
Used Next.js with SSR for property listings
Real estate platforms need search engine visibility for organic traffic, requiring server-side rendering
Image Optimization Strategy
Implemented next/image with responsive srcsets
Property images are the main selling point but also the biggest performance bottleneck
URL-Based Multilingual Routing
Used path-based localization (/en, /ar) instead of subdomain
Simpler deployment and better SEO indexing for both language variants
Client-Side Filtering
Implemented filtering logic on the frontend with URL state
Faster user experience and shareable filter states via URL parameters
Challenges & Solutions
Initial page load times were 5+ seconds due to large property image galleries
Implemented progressive image loading with blur placeholders and lazy loading for images below the fold
Arabic RTL layout was breaking component layouts and causing visual bugs
Used logical CSS properties (start/end instead of left/right) and tested all components in both directions
Property data updates weren't reflecting in real-time for users
Implemented optimistic UI updates with proper error handling and cache invalidation strategies
Outcomes & Impact
MAP DXB launched as a performant, bilingual real estate platform serving the UAE market with fast property browsing and search functionality.
KEY TAKEAWAYS
Client projects require balancing ideal architecture with real-world constraints. Sometimes 'good enough' shipped is better than 'perfect' delayed.
