Experiencing significant delays in keyboard response when using an Angular application on mobile browsers such as Safari

Experiencing a frustrating delay in keyboard response when using an Angular app on mobile Safari and Chrome. Surprisingly, there are no such issues when typing on desktop browsers. Any suggestions for troubleshooting this problem? My hunch is that it may be related to too many watchers on the page, but I'm uncertain.

Answer №1

It's clear that the slowdown in digest cycles is due to the high number of watchers.

A useful tool I recommend for debugging this performance issue is ng-stats, which provides real-time monitoring of the number of watchers running on a page. You can find more information about it here: ng-stats

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

What is the method to determine the length of an animation in Three.js?

Is there a way to retrieve the duration of an animation in three.js? For example, consider the following code snippet: var mixer = new THREE.AnimationMixer(gltf.scene) gltf.animations.forEach((clip)) => { let animation = mixer.clipAction(clip) animati ...

Using HTML, jQuery, and JSON with an AJAX call to populate two web tables stacked on top of each other

I am encountering an issue with populating two tables using two searches based on user input in mySQL-JSON-AJAX. When the user enters a search term and clicks the corresponding button, data should populate the respective table. The problem arises when clic ...

Struggling to concatenate array dynamically in Vue using ajax request

I am working on a Vue instance that fetches objects from a REST endpoint and showcases them on a web page. Most parts of the functionality work smoothly like filtering, however, there is an issue when attempting to add new objects by requesting a new "page ...

Executing an ajax call using an Action in the MVC5 framework

I have encountered a situation where I am having difficulty fixing an issue with my DevExpress MVC components, specifically the treeview. Even though this is a common problem with numerous solutions available online, none of them seem to work in my specifi ...

Selenium for Python is currently incompatible with Chrome version 93

Yesterday, my code ran successfully on Chrome v92.0.4515.107. However, after Chrome automatically updated to v93 today, I encountered an issue with the following part of the code: class CNVD(object): def __init__(self): self.options=webdriver. ...

Thymeleaf not triggering JQuery click event

Currently working on a Spring Boot site where I have a list of elements, each containing a link. The goal is to trigger a javascript function when these links are clicked. <div class="col-sm-4" th:each="product : ${productsList}"> <!-- Code... ...

What is the best way to adjust the CSS of an element within the #shadow-root (open) in web development?

When dealing with a "#shadow-root (open)" element, it appears that manipulating the style using only CSS is not feasible. The shadow-root was generated by a third-party JavaScript script and displays an element as an overlay on the page that I am trying to ...

What is the best way to update my logo and incorporate a colored border at the bottom of my fixed header while the user is scrolling down?

After spending countless hours researching online, I've been struggling to implement header effects on scroll without using JavaScript. My goal is to achieve a simple effect where the header reduces in height, the logo changes, and a colored border is ...

Utilizing the json_encode() function in PHP and JSON.parse() method in JavaScript for handling file data interchange

Utilizing json_encode() in PHP to store an array in a file, then leveraging JSON.parse() in JavaScript on the client side to read the json encoded file and pass it as an array to a sorting algorithm: The result of my json_encode() operation in the ...

Conceal the filename displayed next to the upload button after the file has been successfully uploaded

Is there a way to prevent the browser from displaying the uploaded file name next to the 'Browse/Upload' button on a form? Although it may seem trivial, this specific request has been given to me. <input id="file-upload" type="file" ngf-selec ...

When comparing two state arrays in React, it is important to note that they will not be considered equal and return a boolean (True

As I attempt to compare two arrays stored in my state, my goal is to set a boolean variable to "true" if they match. However, my current if statement fails to detect equality between the arrays. I'm performing this comparison within a setInterval() f ...

Next.js App encounters a missing API route (The requested page is not found)

I have been working on a Next.js app and I created an api route for sending emails. Everything is functioning properly in my development environment. However, after deploying to production, I encountered a 404 error with the message "The page could not b ...

Changing the material properties of an object using Raycaster in Three.js

I currently have a raycaster functioning well in Three.js. Below is the code snippet responsible for defining the action to be taken when the cursor hovers over an object within the scene: function onDocumentMouseMove( event ){ mouse.x = ( event.clien ...

Start the service without the need to include it as an argument

Looking at some older AngularJS code I've inherited, it appears like this: angular .module('MyModule') .directive('MyDirective', []) .controller('MyController', [ 'MyDependency', func ...

Submit application to App Store without including an Apple account

Is it possible to upload my app to the App Store without adding an Apple account in Xcode -> Preferences? I do have access to iTunes Connect, but I don't have access to an Apple Developer account. However, I possess the necessary App Store p12 and ...

Navigating the world of gtag and google_tag_manager: untangling

Tracking custom events in my react application using Google Analytics has been successful. Initially, I followed a helpful document recommending the use of the gtag method over the ga method for logging calls. The implementation through Google Tag Manager ...

Mapbox struggling with performance because of an abundance of markers

I have successfully implemented a feature where interactive markers are added to the map and respond to clicks. However, I have noticed that the performance of the map is sluggish when dragging, resulting in a low frame rate. My setup involves using NextJ ...

Having trouble with the side menu navigation in Bootstrap?

I have a total of 5 pages on my website. Out of these, 2 main pages contain submenus/pages as well. To make users aware of the presence of submenus, I am using plus and minus icons. However, there is an issue where clicking on one submenu toggle icon doe ...

Uniform Fixed Width for Material UI Table Cells

Below is a Material UI Table with columns set to a fixed size of 205px each, and the table itself set to 100% width. However, when there isn't enough space available, the columns do not shrink according to the text inside them, remaining stuck at 205p ...

Using Vuetify Select with Vuex getters

I am having an issue with my Vuex implementation. I have a getter that retrieves an array which I use in a Vuetify drop down select component. My goal is to insert an additional property at the beginning of the array, but when I try to do so, only a number ...