-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
2 changed files
with
229 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,136 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="utf-8"> | ||
<meta http-equiv="X-UA-Compatible" content="IE=edge"> | ||
<meta name="HandheldFriendly" content="True" /> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
|
||
<!-- Permissions-Policy meta tags --> | ||
<meta http-equiv="Permissions-Policy" content="interest-cohort=()"> | ||
<meta http-equiv="Permissions-Policy" content="attribution-reporting=*"> | ||
<meta http-equiv="Permissions-Policy" content="run-ad-auction=*"> | ||
<meta http-equiv="Permissions-Policy" content="join-ad-interest-group=*"> | ||
<meta http-equiv="Permissions-Policy" content="browsing-topics=*"> | ||
|
||
<meta name="theme-color" content="#c7ecee"> | ||
<link rel="shortcut icon" href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAACXBIWXMAAA7EAAAOxAGVKw4bAAABqklEQVQ4jZ2Tv0scURDHP7P7SGWh14mkuXJZEH8cgqUWcklAsLBbCEEJSprkD7hD/4BUISHEkMBBiivs5LhCwRQBuWgQji2vT7NeYeF7GxwLd7nl4knMwMDMfL8z876P94TMLt+8D0U0EggQSsAjwMvga8ChJAqxqjTG3m53AQTg4tXHDRH9ABj+zf6oytbEu5d78nvzcyiivx7QXBwy46XOi5z1jbM+Be+nqVfP8yzuD3FM6rzIs9YE1hqGvDf15cVunmdx7w5eYJw1pcGptC9CD4gBUuef5Ujq/BhAlTLIeFYuyfmTZgeYv+2nPt1a371P+Hm1WUPYydKf0lnePwVmh3hnlcO1uc7yvgJUDtdG8oy98kduK2KjeHI0fzCQINSXOk/vlXBUOaihAwnGWd8V5r1uhe1VIK52V6JW2D4FqHZX5lphuwEE7ooyaN7gjLMmKSwYL+pMnV+MA/6+g8RYa2Lg2RBQbj4+rll7uymLy3coiuXb5PdQVf7rKYvojAB8Lf3YUJUHfSYR3XqeLO5JXvk0dhKqSqQQoCO+s5AIxCLa2Lxc6ALcAPwS26XFskWbAAAAAElFTkSuQmCC" /> | ||
|
||
<title>DNS Resolvers</title> | ||
<meta name="description" content="DNS Resolvers - Check the Loading Time and Connection Speed."/> | ||
|
||
<link rel="preconnect" href="https://cdnjs.cloudflare.com"> | ||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.3/css/bulma.min.css" integrity="sha512-IgmDkwzs96t4SrChW29No3NXBIBv8baW490zk5aXvhCD8vuZM3yUSkbyTBcXohkySecyzIrUwiF/qV0cuPcL3Q==" crossorigin="anonymous" referrerpolicy="no-referrer" /> | ||
<link rel="preconnect" href="https://fonts.googleapis.com"> | ||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> | ||
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap" rel="stylesheet"> | ||
|
||
<style> | ||
html, body { | ||
background-color: #FDA7DF; | ||
padding-bottom: 20px; | ||
} | ||
body { | ||
font-family: "Roboto Mono", monospace; | ||
font-weight: 600; | ||
word-wrap: break-word; | ||
-moz-osx-font-smoothing: grayscale; | ||
-webkit-font-smoothing: antialiased !important; | ||
-moz-font-smoothing: antialiased !important; | ||
text-rendering: optimizelegibility !important; | ||
} | ||
/* Custom loader styles */ | ||
.loader { | ||
border: 4px solid rgba(0, 0, 0, 0.1); | ||
border-left-color: #3273dc; | ||
border-radius: 50%; | ||
display: inline-block; | ||
width: 24px; | ||
height: 24px; | ||
animation: spin 1s linear infinite; | ||
} | ||
|
||
@keyframes spin { | ||
to { | ||
transform: rotate(360deg); | ||
} | ||
} | ||
|
||
/* Adjust loading text size */ | ||
#loading-indicator { | ||
font-size: 16px; /* Adjust as needed */ | ||
} | ||
/* Default styles for the table */ | ||
.table-wrapper table { | ||
width: 100%; | ||
border-collapse: collapse; | ||
font-family: "Roboto Mono", monospace; | ||
font-weight: 700; | ||
font-size: 15px; | ||
} | ||
|
||
/* Styles for table headers */ | ||
.table-wrapper th { | ||
background-color: #f2f2f2; | ||
border: 1px solid #dddddd; | ||
padding: 8px; | ||
text-align: left; | ||
} | ||
|
||
/* Styles for table cells */ | ||
.table-wrapper td { | ||
border: 1px solid #dddddd; | ||
padding: 8px; | ||
text-align: left; | ||
} | ||
|
||
/* Media query for smaller screens (e.g., mobile devices) */ | ||
@media screen and (max-width: 600px) { | ||
/* Modify table layout for smaller screens */ | ||
.table-wrapper table { | ||
width: 100%; /* Ensure table occupies full width of viewport */ | ||
} | ||
.table-wrapper th, | ||
.table-wrapper td { | ||
padding: 4px; /* Decrease padding for smaller screens */ | ||
font-size: 15px; /* Decrease font size for smaller screens */ | ||
font-weight: 700; | ||
} | ||
} | ||
</style> | ||
|
||
</head> | ||
<body> | ||
<section class="section"> | ||
<div class="container"> | ||
<h1 class="title has-text-centered is-size-6">Public DNS Resolvers</h1> | ||
<div class="card rounded"> | ||
<div class="card-content"> | ||
<br> | ||
<div class="table-container table-wrapper"> | ||
<table id="resolver-table" class="table is-fullwidth is-hoverable"> | ||
|
||
<tr> | ||
<th>DNS and Domain</th> | ||
<th>Loading Time</th> | ||
<th>Connection Speed</th> | ||
</tr> | ||
|
||
<tbody> | ||
</tbody> | ||
</table> | ||
</div> | ||
</div> | ||
<br> | ||
<div id="loading-indicator" class="has-text-centered" style="display: none;"> | ||
<span class="loader"></span> | ||
</div> | ||
<br> | ||
</div> | ||
</div> | ||
</section> | ||
|
||
<script src="script.js"></script> | ||
|
||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,93 @@ | ||
document.addEventListener('DOMContentLoaded', async function () { | ||
const resolverTable = document.getElementById('resolver-table').getElementsByTagName('tbody')[0]; | ||
const loadingIndicator = document.getElementById('loading-indicator'); | ||
|
||
// Array of public DNS resolvers | ||
const resolvers = [ | ||
{ name: 'Google', dnsServer: '8.8.8.8' }, | ||
{ name: 'Cloudflare', dnsServer: '1.1.1.1' }, | ||
{ name: 'Quad9', dnsServer: '9.9.9.9' }, | ||
{ name: 'OpenDNS', dnsServer: '208.67.222.222' }, | ||
{ name: 'AdGuard', dnsServer: '94.140.14.14' }, | ||
{ name: 'CleanBrowsing', dnsServer: '185.228.168.168' }, | ||
{ name: 'Mullvad (ADblock)', dnsServer: '194.242.2.3' }, | ||
{ name: 'Mullvad (base)', dnsServer: '194.242.2.4' }, | ||
// Add more resolvers as needed | ||
]; | ||
|
||
// URLs to measure loading time and connection speed | ||
const testUrls = ['https://www.google.com', 'https://www.bing.com', 'https://github.com', 'https://duckduckgo.com', 'https://search.brave.com']; | ||
|
||
// Function to measure loading time and connection speed | ||
async function measureLoadingTimeAndSpeed(urls) { | ||
const results = []; | ||
for (const url of urls) { | ||
const startTime = performance.now(); | ||
try { | ||
await fetch(url, { cache: 'no-store', mode: 'no-cors', headers: { 'X-DNS-Prefetch-Control': 'off' } }); | ||
} catch (error) { | ||
console.error('Failed to load the webpage:', error); | ||
results.push(null); | ||
continue; | ||
} | ||
const endTime = performance.now(); | ||
const loadingTime = endTime - startTime; | ||
const fileSize = 1; // 1 MB (Assuming the fetched resource is approximately 1MB) | ||
const connectionSpeed = fileSize / (loadingTime / 1000); // Connection speed in Mbps | ||
results.push({ loadingTime, connectionSpeed }); | ||
} | ||
return results; | ||
} | ||
|
||
// Function to convert milliseconds to seconds or minutes | ||
function formatTime(milliseconds) { | ||
if (milliseconds < 1000) { | ||
return milliseconds.toFixed(2) + ' ms'; | ||
} else if (milliseconds < 60000) { | ||
return (milliseconds / 1000).toFixed(2) + ' secs'; | ||
} else { | ||
return (milliseconds / 60000).toFixed(2) + ' mins'; | ||
} | ||
} | ||
|
||
// Function to format connection speed in Mbps or Kbps | ||
function formatSpeed(speed) { | ||
if (speed < 1) { | ||
return (speed * 1000).toFixed(2) + ' Kbps'; | ||
} else { | ||
return speed.toFixed(2) + ' Mbps'; | ||
} | ||
} | ||
|
||
// Populate the table with resolver data | ||
async function populateTable() { | ||
loadingIndicator.style.display = 'block'; | ||
for (const resolver of resolvers) { | ||
const results = await measureLoadingTimeAndSpeed(testUrls); | ||
let lastIpAddress = null; // Reset last IP address for each resolver | ||
// Check if the resolver has the same IP address as the last one | ||
if (resolver.dnsServer !== lastIpAddress) { | ||
const ipRow = resolverTable.insertRow(); | ||
const ipCell = ipRow.insertCell(); | ||
ipCell.setAttribute('colspan', '5'); // Adjust colspan based on the number of columns in your table | ||
ipCell.innerHTML = `<br> ${resolver.name}: ${resolver.dnsServer} <br><br>`; | ||
lastIpAddress = resolver.dnsServer; | ||
} | ||
for (let i = 0; i < testUrls.length; i++) { | ||
const { loadingTime, connectionSpeed } = results[i]; | ||
if (loadingTime !== null && connectionSpeed !== null) { | ||
const row = resolverTable.insertRow(); | ||
row.innerHTML = `<td>${testUrls[i]}</td><td>${formatTime(loadingTime)}</td><td>${formatSpeed(connectionSpeed)}</td>`; | ||
} else { | ||
console.warn(`Failed to measure speed for resolver: ${resolver.name}`); | ||
const row = resolverTable.insertRow(); | ||
row.innerHTML = `<td colspan="4" class="has-text-centered">Failed to measure speed for ${resolver.name} and ${testUrls[i]}</td>`; | ||
} | ||
} | ||
} | ||
loadingIndicator.style.display = 'none'; | ||
} | ||
|
||
populateTable(); | ||
|
||
}); |