A modern, feature-rich internet speed test application built with React Native Expo 54, NativeWind v5, and TypeScript. Test your download speed, upload speed, ping, jitter, and packet loss — all with a beautiful dark UI and persistent history.
| Speed Test | History | Network Info |
|---|---|---|
 |
 |
 |
|
- Download Speed — measures real-world download throughput (Mbps)
- Upload Speed — measures real-world upload throughput (Mbps)
- Ping — round-trip latency in milliseconds
- Jitter — variation in ping response times (ms)
- Packet Loss — percentage of lost packets during the test
- Average Speed — running average across all past tests
- Bar graph of past speed test results (download & upload)
- Highlights Newest, Fastest, and Slowest results at a glance
- Persistent history stored locally — data survives app restarts
- Tap any history entry for full test details
- Wi-Fi / Cellular connection type detection
- IP Address (local and/or public)
- Platform (iOS / Android)
- OS Version
- Internet Access status (connected / disconnected)
- Device Model info via Expo Device
| Technology | Version | Purpose |
|---|---|---|
| Expo | ~54.0.0 | App framework & build tooling |
| React Native | 0.76.5 | Cross-platform mobile UI |
| NativeWind | ^5.0.1 | Tailwind CSS utility classes for RN |
| Tailwind CSS | ^3.4.0 | Utility-first CSS (NativeWind peer) |
| TypeScript | ^5.3.0 | Type safety |
| Expo Router | ~4.0.0 | File-based navigation |
| Expo Network | ~6.0.0 | Network info (IP, type, connectivity) |
| Expo Device | ~7.0.0 | Device & OS information |
| Expo Constants | ~17.0.0 | App constants |
| React Native SVG | ^15.8.0 | Bar chart graphs |
| React Native Reanimated | ~3.16.1 | Smooth animations |
| AsyncStorage | ^1.23.1 | Local persistent storage |
| Zustand | ^4.5.0 | Lightweight state management |
SpeedTestApp/
├── app/
│ ├── _layout.tsx ← Root layout, StatusBar, SafeAreaProvider
│ └── (tabs)/
│ ├── _layout.tsx ← Bottom tab bar (3 tabs)
│ ├── index.tsx ← Speed test screen ⚡
│ ├── history.tsx ← Test history + chart 📊
│ └── network.tsx ← Network diagnostics 🌐
├── components/
│ ├── SpeedGauge.tsx ← SVG arc gauge with animated needle
│ ├── PulseRing.tsx ← Animated pulse rings during test
│ ├── HistoryCard.tsx ← Individual result card with badges
│ ├── SpeedChart.tsx ← SVG line chart (download + upload)
│ └── NetworkCard.tsx ← Network info summary card
├── services/
│ ├── speedTest.ts ← Real HTTP speed measurement engine
│ └── storage.ts ← AsyncStorage CRUD for history
├── types/index.ts ← All TypeScript interfaces
├── package.json / app.json
├── babel.config.js / metro.config.js
├── tailwind.config.js / global.css
└── tsconfig.json
# 1. Clone the repository
git clone https://github.com/Jaykumar122/NET-SPEED-TESTPRO.git
cd net-speedtest-pro
# 2. Install dependencies
npm install
# 3. Start the development server
npx expo startThen scan the QR code with Expo Go (Android) or the Camera app (iOS).
# iOS Simulator (macOS only)
npx expo start --ios
# Android Emulator
npx expo start --androidNo API keys are required. The speed test uses publicly available endpoints (e.g., Cloudflare, fast.com-style chunked requests) and can be configured in utils/speedTest.ts.
- Ping & Jitter — sends multiple HTTP HEAD requests to a test endpoint, measures round-trip time, calculates variance (jitter).
- Download — fetches a large binary payload, measures bytes received over time, computes throughput in Mbps.
- Upload — sends a large binary payload via POST, measures time to completion, computes throughput in Mbps.
- Packet Loss — fires N requests in parallel and counts failures/timeouts as lost packets.
- Results are saved to AsyncStorage via the Zustand store for persistent history.
- Bar chart rendered with React Native SVG — no third-party charting lib needed.
- Each bar represents one test session (download in cyan, upload in green).
- Badges highlight:
- 🟦
NEWEST— most recent result - 🟩
FASTEST— highest download speed - 🟥
SLOWEST— lowest download speed
- 🟦
- Swipe or tap to delete individual results.
Uses expo-network and expo-device to display:
| Field | Source |
|---|---|
| Connection Type | Network.getNetworkStateAsync() |
| IP Address | Network.getIpAddressAsync() |
| Internet Access | Network.getNetworkStateAsync().isInternetReachable |
| Platform | Platform.OS |
| OS Version | Device.osVersion |
| Device Model | Device.modelName |
- Real server selection (pick nearest test server)
- IPv6 address display
- Share result card as image
- Widget support (iOS 16+ / Android)
- Unit toggle: Mbps ↔ MB/s
- Dark / Light theme toggle
MIT License
Copyright (c) 2025 JAYKUMAR112
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
- Expo Team for the amazing DX
- NativeWind for bringing Tailwind to React Native
- Cloudflare Speed Test for endpoint inspiration
- React Native SVG for the chart primitives
Built with ❤️ using React Native + Expo
>>>>>>> 4e72a73f9509347c21e061cd28dde588da89367f