sebastjan/videofolxtv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve application loading robustness and error handling on Chrome

Browse Source 
Add a timeout to detect and handle Chrome loading issues, implement preloading attributes, and improve error reporting for failed React app mounts.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 890577b1-c154-40a4-a177-a0c6d55320c3
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/890577b1-c154-40a4-a177-a0c6d55320c3/DyHCx4q
This commit is contained in:
sebastjanartic
2025-09-02 10:31:39 +00:00
parent 725fb58385
commit c3f50f869a
2 changed files with 102 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/index.html
+27 -5
View File
@@ -101,13 +101,34 @@
}
</style>
</div>
<script type="module" src="/src/main.tsx"></script>
<script type="module" src="/src/main.tsx" defer></script>
<link rel="preload" href="/src/main.tsx" as="script" crossorigin>
<link rel="dns-prefetch" href="//fonts.googleapis.com">
<link rel="preconnect" href="//fonts.gstatic.com" crossorigin>
<!-- Replit script removed - caused scrolling issues -->
<!-- Debug script for deployment issues -->
<script>
console.log('🚀 go4.video loading...');
// Set timeout to detect hanging in Chrome
let appLoadTimeout = setTimeout(function() {
console.warn('⚠️ App taking too long to load in Chrome, forcing refresh...');
const preloader = document.getElementById('app-preloader');
if (preloader) {
preloader.innerHTML = '<div style="text-align: center; color: white;"><h2>Loading timeout</h2><p>Refreshing automatically...</p></div>';
}
setTimeout(function() {
location.reload();
}, 2000);
}, 8000); // 8 second timeout for Chrome
// Global callback for when app loads successfully
window.appLoaded = function() {
clearTimeout(appLoadTimeout);
console.log('⏱️ App load timeout cleared');
};
// Clear any cached service workers
if ('serviceWorker' in navigator) {
navigator.serviceWorker.getRegistrations().then(function(registrations) {
@@ -122,16 +143,17 @@
console.log('✅ Window loaded');
setTimeout(function() {
const root = document.getElementById('root');
if (root && root.innerHTML.trim() === '') {
console.error('❌ React app failed to mount - root div is empty');
root.innerHTML = '<div style="color: red; padding: 20px; font-family: Arial; text-align: center; background: #000; height: 100vh; display: flex; align-items: center; justify-content: center;"><div><h1>Error: React app failed to load</h1><p>Refreshing page automatically...</p></div></div>';
const preloader = document.getElementById('app-preloader');
if (preloader && preloader.style.opacity !== '0') {
console.error('❌ React app failed to mount - preloader still visible');
preloader.innerHTML = '<div style="text-align: center; color: white;"><h2>Loading failed</h2><p>Refreshing automatically...</p></div>';
// Auto-refresh after 3 seconds
setTimeout(function() {
location.reload();
}, 3000);
}
}, 2000);
}, 5000);
});
window.addEventListener('error', function(e) {