Launch Specification

SciRank

Modern Academic Ranking & Analytics Frontend Platform

GitHub Repository

Overview

SciRank is an academic analytics frontend designed to visualize institution rankings, index datasets, and output custom academic metrics.

Problem Statement

Existing academic index pages use outdated HTML tables that load slowly, lack responsive design, and are highly difficult for search engine crawlers to parse.

Our Solution

SciRank leverages React's virtual DOM to sort and filter institutional datasets on the client side, showing data grids instantly while using semantic HTML5 structures to guarantee optimal crawlability.

Detailed Technology Stack

Frontend Engine

React.js

Dynamic list mapping and client side state hooks.

Framework

Next.js

Static page exports for quick FCP scores.

Styling

Tailwind CSS

Utility-first CSS framework for layout configurations.

Key Operational Features

01.

Dynamic Sorting Grids: Sort and filter university ranks instantly by multiple metrics.

02.

Mobile-Optimized Tables: Fully responsive horizontal card shifts for mobile displays.

03.

Semantic HTML5 Markup: Strict hierarchical structure optimized for Google crawler reading.

04.

Lightweight Assets: Minimized JS bundles with zero heavy library dependencies.

Engineering Challenges Solved

Case Study #1

Rendering large tables with hundreds of records without stuttering: Solved by executing client-side pagination and sorting arrays in Web Worker threads to keep the main thread clear.

Case Study #2

Ensuring crawlers index the dataset: Solved by pre-rendering the default table state on the server during the Next.js compile stage.

Outcome & Project Results

Achieved a 100/100 Lighthouse SEO score and reduced interaction delays on large tables to less than 15ms.

Related Portfolio Pages