Siha Polyclinic
A high-performance digital clinical portal and multi-specialty directory for an accredited polyclinic healthcare facility in Tanga, Tanzania.
Clinical Accessibility & Infrastructure Constraints
Siha Polyclinic is an accredited multi-specialty healthcare facility located on Market Street in Tanga, Tanzania, operating over 20 specialized medical departments ranging from cardiology and orthopedics to diagnostic radiology, physiotherapy, and 24/7 pharmacy services.
Patients across Tanga and surrounding coastal districts routinely access clinical information over cellular connections with high packet latency and variable throughput. Under these network realities, heavy Single-Page Application (SPA) bundles frequently fail to hydrate reliably or stall before presenting critical clinic operating hours, doctor rosters, and triage contacts.
The engineering goal was to build a zero-runtime, ultra-resilient healthcare portal that guarantees immediate readability, zero bundle overhead, and sub-second navigation across entry-level mobile devices without ongoing cloud infrastructure costs.
Zero-Runtime Architecture & Overhead Reduction
To avoid JavaScript engine parse and compile bottlenecks on budget mobile hardware, the platform was engineered as a static multi-page architecture with semantic HTML5, targeted CSS3, and vanilla JavaScript. This decision bypassed the bundle bloat of modern client frameworks, yielding a sub-650ms First Contentful Paint (FCP) and keeping total custom JavaScript under 5KB across the core application.
The facility geolocation interface initially loaded the Google Maps JavaScript API, which required exposing a client-side API key and introduced unpredictable billing quota risks. The mapping layer was refactored to an open-source Leaflet.js implementation backed by CartoDB Voyager raster tiles. This eliminated recurring API costs, removed third-party key tracking vulnerabilities, and resolved mobile gesture trapping by configuring scrollWheelZoom to false.
Dynamic elements were designed to minimize main-thread execution time. Metric counter statistics utilize native browser IntersectionObserver instances that immediately unobserve target nodes once triggered, avoiding scroll-event overhead. In addition, critical above-the-fold hero images are preloaded via fetchpriority="high" and paired with CSS shimmer skeleton states to eliminate Cumulative Layout Shift (CLS).
// Function to filter doctors
function filterDoctors() {
const searchQuery = searchInput.value.toLowerCase();
const selectedSpecialty = specialtySelect.value;
const filteredDoctors = doctors.filter(doctor => {
const matchesName = doctor.name.toLowerCase().includes(searchQuery);
const matchesSpecialty = selectedSpecialty ? doctor.specialty === selectedSpecialty : true;
return matchesName && matchesSpecialty;
});
displayDoctors(filteredDoctors);
}
// Function to display doctors in the UI
function displayDoctors(doctorsToDisplay) {
doctorList.innerHTML = ""; // Clear previous listings
doctorsToDisplay.forEach(doctor => {
const doctorCard = document.createElement("div");
doctorCard.classList.add("doctor-card");
doctorCard.innerHTML = `
<img src="${doctor.image}" alt="${doctor.name}">
<h3>${doctor.name}</h3>
<p><b>${doctor.specialty}</b></p>
<p style="font-size: 15px;">${doctor.qualification}</p>
<button>BOOK APPOINTMENT</button>
`;
doctorList.appendChild(doctorCard);
});
}
// Initial load
filterDoctors();
// Event listeners
searchInput.addEventListener("input", filterDoctors);
specialtySelect.addEventListener("change", filterDoctors);In-memory multi-facet directory filtering algorithm executing sub-5ms lookups across clinical specialties and personnel names. Synchronous client-side DOM reconciliation delivers instant feedback without server roundtrips.
Operational Impact & Architectural Takeaways
Deploying a zero-runtime static architecture gave Siha Polyclinic a 100% uptime web presence without requiring backend server provisioning, container management, or database administration. Operational hosting costs remain at zero dollars per month while reliably serving patient traffic across coastal Tanzania.
The low-friction directory architecture enabled patients to locate specialists and initiate appointments or WhatsApp consultations with zero latency. This removed phone triage bottlenecks for clinic administrative staff during peak morning intake hours.
The project underscores a core architectural conviction for East African digital platforms: in bandwidth-constrained environments, removing framework abstractions in favor of standards-compliant web primitives yields superior page-load performance, zero operational maintenance overhead, and total device accessibility.