Cordova Application experiencing freeze on loading Splash Screen

My issue lies in the behavior of the app built with Backbone.js and Cordova. Everything works smoothly when there is an active network connection, but things change when the device goes offline. During each launch under offline conditions, the app exhibits different behaviors.

Interestingly, the app freezes before even reaching the App Init code, which marks the beginning of the app's execution.

What could be causing such unpredictable behavior?

Could it be a race condition between the loading of Cordova Plugins? This suspicion arises from the fact that the console.log() statement within one of the plugins consistently works, even when the app freezes at the splash screen.

Please review the list of Cordova plugins being used:

<plugin name="cordova-plugin-inapppurchase" spec="~1.0.0" />
    <plugin name="phonegap-plugin-push" spec="~1.8.0">
        <variable name="SENDER_ID" value="572****26*6" />
    </plugin>
    <plugin name="com.virtualartifacts.webintent" spec="https://github.com/florentvaldelievre/virtualartifacts-webIntent.git" />
    <plugin name="cordova-plugin-camera" spec="~2.2.0" />
    <plugin name="cordova-plugin-console" spec="~1.0.3" />
    <plugin name="cordova-plugin-device" spec="~1.1.2" />
    <plugin name="cordova-plugin-dialogs" spec="~1.2.1" />
    <plugin name="cordova-plugin-file" spec="~4.2.0" />
    <plugin name="cordova-plugin-file-transfer" spec="~1.5.1" />
    <plugin name="cordova-plugin-inappbrowser" spec="~1.4.0" />
    <plugin name="cordova-plugin-network-information" spec="~1.2.1" />
    <plugin name="cordova-plugin-splashscreen" spec="~3.2.2" />
    <plugin name="cordova-plugin-vibration" spec="~2.1.1" />
    <plugin name="cordova-plugin-whitelist" spec="~1.2.2" />
    <plugin name="parse-push-plugin" spec="https://github.com/taivo/parse-push-plugin" />
    <plugin name="cordova-plugin-statusbar" spec="~2.1.3" />

Any assistance in pinpointing the debugging process would be highly appreciated. Where do you suggest I should start my investigation?

Answer №1

Below are some important points to keep in mind:

  1. Ensure that all JavaScript and CSS files are being called locally in your index.html file.

  2. Make sure that all plugin functions in your main JavaScript file are running after the deviceready state.

  3. Double check your 'Content-Security-Policy' to ensure it is correctly configured.

  4. During testing, change the 'AutoHideSplashScreen' setting to true for a better experience.

  5. Uninstall any unused plugins to improve performance.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Incorporating React.js with a server API that doesn't use JavaScript

My upcoming project involves enhancing my current application frontend by implementing React.js. The existing frontend currently utilizes standard REST calls to communicate with a server built using Microsoft technologies, and there are no plans of changin ...

What could be causing UITableCell to not show any content?

I created a unique custom cell for a UITableView using Interface Builder and Storyboards. Despite having valid data in cA.cBusName and cA.cOrderDate, the cell labels (cell.busNameLabel.text, cell.orderDateLabel.text) remain unset. Why is this functionality ...

Implementing Vue modal within a Laravel 5.2 foreach loop

I am facing a challenge with my Laravel blade template that uses a foreach loop to create a table with data. Each row has a link that triggers a modal when clicked. However, the issue is that clicking on any link activates the modal for every row instead o ...

Enable the option to customize the icon of the recently activated sidebar menu item

I need help with changing the arrow icon of a menu-item only when it is clicked, without affecting all other menu-items. In the image below, you can see that currently, clicking on any menu-item changes all the arrows. Attached Image //sidebarMenu jQu ...

Troubleshooting problems with opening and closing windows in JavaScript

I'm currently facing an issue with managing browser windows using JavaScript. In my proof of concept application, I have two pages - one for login information (username, password, login button, etc.) and the second page is a management screen. What I ...

What is the reason for jQuery's inability to recognize ":not(#menu *)" in a selector?

I have created a Javascript-based navigation bar that is triggered by clicks instead of hover for better mobile usability. I have made sure to keep the HTML, CSS, and JavaScript code as simple as possible. To ensure that clicking anywhere outside the menu ...

What is the best way to display a view controller exclusively during the initial launch in an iOS app?

I need the operator screen to display with three operators the first time the app launches. If no operator is selected and the app is closed, upon reopening the app I want to still see the operator screen when navigating to the home view controller. Below ...

What is the best way to rotate an image using AngularJS?

Hey there, I've got an image that I need help rotating. There are two buttons - left and right - that should rotate the image 45 degrees in opposite directions. I attempted to create a directive using the jquery rotate library, but it's not worki ...

Displaying Component when Clicked using Vue.js

How can I display a modal component after an "on click" event? Is it possible to show a component using a method call, or what is the recommended approach in this scenario? Here is my specific use case: I have multiple cards each containing various infor ...

Switching the default z-index for child elements within an HTML container

According to the specification, elements are typically drawn "in tree order" for in-flow, non-positioned elements of similar block level or float status and identical z-index. This means that elements declared last in the HTML markup appear on top. But wha ...

Monitoring changes in an array of objects using AngularJS's $watch function

Exploring the world of AngularJS, I'm on a quest to solve a challenging issue efficiently. Imagine having an array of objects like this: var list = [ {listprice: 100, salesprice:100, discount:0}, {listprice: 200, salesprice:200, discount:0}, {listpr ...

The functionality of my script relies on the presence of an alert function within it

My code seems to only work when I include an alert function in it. I'm trying to make my div scroll to the bottom. I've done some research, but for some reason, the script doesn't run without an alert function. $(document).ready(function ...

Utilizing jQuery for asynchronous image uploading

Just started learning jQuery and I'm having trouble uploading a jpg image file using the ajax method. It seems like it's not working properly. Can anyone guide me through this process? HTML <form action="" method="POST" enctype="multipart/fo ...

Highlighting the current menu item by comparing the URL and ID

Looking to make my navigation menu items active based on URL and ID, rather than href. None of the suggested solutions (like this one, this one, or this one) have worked for me. This is how my Navigation is designed: <nav id="PageNavigation"& ...

Using a pre-defined function as a parameter will not function properly with the event listener

As a beginner, I recently attempted the following: ul.addEventListener("click", function(e) { console.log("Hi"); }); Surprisingly, this code worked just fine. I learned that the function used here is anonymous. However, when I tried ...

Consistentize Column Titles in Uploaded Excel Spreadsheet

I have a friend who takes customer orders, and these customers are required to submit an excel sheet with specific fields such as item, description, brand, quantity, etc. However, the challenge arises when these sheets do not consistently use the same colu ...

Navigating a NSDictionary Containing JSON Information

Currently, I have an NSDictionary that contains JSON data obtained by using the following code: NSDictionary* dictionary = [NSJSONSerialization JSONObjectWithData:data options:NSJSONReadingMutableContainers error:&someError]; Upon logging my dictiona ...

Incorporating a Custom CKEditor5 Build into an Angular Application

I am currently in the process of developing an article editor, utilizing the Angular Integration for CKEditor5. By following the provided documentation, I have successfully implemented the ClassicEditor build with the ckeditor component. Below are the ess ...

Using useCallback with an arrow function as a prop argument

I'm having trouble understanding the code snippet below <Signup onClick={() => {}} /> Upon inspecting the Signup component, I noticed the implementation of useCallback as follows const Signup = ({onClick}) => { const handleClick = us ...

What is the best way to ensure that my theme button changer has an impact on all pages throughout my website, not only on the

Looking for some help here - I've got a button that changes the theme/colour of my website, but it only seems to work on the homepage and not on any other pages. Anyone know how I can fix this issue? Here's the JavaScript code: $(document).ready ...