Working on my college project has been going smoothly, except for one issue with slow loading times. It's frustrating how long it takes to load.
I suspect that there might be an error in the deployment process or something else causing the delay. The project is deployed on a Heroku Hobby server that costs $7 a month and is set to never go to sleep.
How can I use Chrome Inspect or a similar tool to properly diagnose what is causing this 20-second delay before anything appears on the screen?
During my experience, the page took approximately 9.85 seconds to load the DOM content and a total of 33.91 seconds to fully load. It's worth mentioning that I'm currently located in Korea, so loading times may vary slightly for me.
As others have mentioned, the excessive number of script tags on your page is causing delays. Each script tag results in a separate request, leading to a bottleneck as each one must wait for the previous request to finish before initiating.
To significantly improve loading speed, consider consolidating and compressing your scripts into as few files as possible. Perhaps create one bundle for third-party scripts and another for all your own scripts. Additionally, implementing caching mechanisms can also help enhance performance.
Utilizing the networking and auditing features in Chrome DevTools (inspect) can be instrumental in identifying issues, especially when it comes to the number of scripts being loaded.
Check out the Networking tab here: https://i.sstatic.net/DPm9S.png
For auditing purposes, explore the Audit tab using this link: https://i.sstatic.net/bVh4l.png
I am encountering an issue while trying to display data in a table by clicking on a search button. The problem arises when there is no data between the specified "Fromdate - Todate" range; the error message appears correctly. However, even after entering t ...
I'm trying to figure out the best approach for developing a chat application that can handle thousands of users. I'm unsure about how to efficiently ping the server using AJAX at intervals of every second or less, and then check for any new reco ...
I'm attempting to create a Bootstrap UI Modal that is centered both vertically and horizontally. While I found this solution that successfully centers the modal vertically, it loses its horizontal centering when applied to my own template with 800px ...
Struggling to implement conditional required fields on a form. The approach I've taken is by setting a data field notRequired: false, and then using it in the fields like this: :required="!notRequired". This allows me to make certain fields not requir ...
As I work on implementing a feature where a small JSON object is written to the URL as a user interacts with items on a page, I also want to make sure the URL can be read later so users can resume where they left off. I successfully managed to create the ...
Currently, I am utilizing C# and Selenium to browse through a website and have come across an issue regarding passing variables into my JavaScriptExecutor command. When I attempt to do so using the code below: ((IJavaScriptExecutor)webdriver).ExecuteScript ...
Within my content management system (CMS), I have a specific page that fetches various mini-interfaces from PHP files located in an /ajax directory using AJAX. I am wondering if there is a way to restrict access to these files solely through AJAX requests ...
My goal is to retrieve responses from an AJAX call and store them in the global scope for easy access throughout my website. var getOrderStatus = getOrderStatus(), getUserData = getUserData(), orderFormReady = $.when(getOrderStatus, getUserData), ...
chrome.webRequest.onBeforeRequest.addListener(function(details) { if (localStorage.on == '1') { return {cancel:true}; } }, {urls: ["*://*.domain1.net/*","*://*.domain2.com/*","*://*.domain3.com/*"], types: ["script","xmlhttpreques ...
Is it possible to dynamically resize a Facebook plugin comment based on the window or browser size? I want the fb-comment div to automatically adjust its size to match the parent element when the browser window is resized. <div id="socialDiv" class="c ...
Issue Encountering a crash in my Next.js/React/Node application whenever I utilize import Chart from "react-apexcharts" in any file. Upon attempting to access the app, an error message is displayed: Server Error ReferenceError: window is not ...
I have developed a service for a current project and now I am working on writing a unit test for it. Below is the code snippet for the service: angular.module('services').factory('Authorization', ['$q', 'Refs', func ...
Is there a way to dynamically call an addon function with varying argument lengths? I capture user input in a variable like this: Uinput = [5,3,2]; Now, I want to pass these numbers as arguments to my addon function like this: addon.myaddon(5,3,2); I n ...
Is there a way to set the position of ng-map view using the ng-map directive not as the center value of [40.74, -74.18], but instead as a rectangle defined by the corner values of the map view (north, south, east, west)? Currently, I have this code: < ...
When working with a save function that requires you to call another function to retrieve the revision number and make an API call, both of which are asynchronous in nature, how can you ensure one function waits for the other to execute? $scope.getRevision ...
I am encountering an issue while trying to show XML content as is in an $mdDialog using Angular Material. When I use a standard alert, the XML appears correctly with all tags intact. However, when using $mdDialog or Angular, it seems to remove all the XML ...
My select input element has multiple attributes and a fixed width set. Unfortunately, due to the fixed width, the overflowing content in the x-direction is not visible. To address this issue, I have created a JavaScript function that uses the title attribu ...
I have developed a unique drag and drop application that features both a left and right panel. The issue I am facing is that when I drag the ball from the left panel to the right panel, it does get dragged successfully. However, the problem arises when the ...
I am facing an issue with a form on my website that contains input fields as shown below. I am trying to add two input boxes to calculate the values of the third input box, but it is only working correctly for the first set and not for the rest. How can ...
I'm encountering an issue with my web application. The error keeps popping up. app.get("/campground/:id/comments/new",function(req,res){ camp.findById(req.params.id)({ if(err) console.log(err); else ...