Is there a way to trigger $q notify without initiating a $digest cycle?

Within my application, the $digest cycle typically takes around 5ms to complete. I heavily utilize $q.defer with deferred.notify throughout my codebase, but I've encountered an issue. Each time deferred.notify is triggered, it schedules a new digest cycle, causing Angular to run for another 5ms.

This problem becomes apparent when retrieving thousands of rows of data from a server via WebSocket, where each piece of data is received individually. During this process, the app may max out CPU usage and become unresponsive, despite only saving the data into IndexedDB afterwards.

Is there a way to leverage $q and notify without triggering a new $digest cycle?

I've considered using a different promise implementation specifically for WebSocket and IndexedDB operations, but I'm hesitant due to the complexities it introduces in managing two different promise types within the same application.

javascriptangularjsangular-promiseangularjs-digest

Answer №1

Perhaps consider exploring alternative promise implementations for improved efficiency. Utilizing a library like RxJS could be beneficial in handling asynchronous tasks without triggering unnecessary digest cycles in Angular. With a non-Angular promise solution such as the browser-native version or Bluebird, manual digestion of data may be required. Personally, I leverage RxJS to manage websocket events and selectively call scope.$apply when necessary, avoiding excessive updates on each event.

Answer №2

While exploring, I stumbled upon $$q. As far as I can tell, it seems to be $q without the digest cycle, which is exactly what I've been looking for.

The only issue is that it appears to be an undocumented private service.

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

Attempting to instruct my chrome extension to execute a click action on a specific element found within the webpage

I am currently working on developing a unique chrome extension that has the capability to download mp3s specifically from hiphopdx. I have discovered a potential solution, where once the play button on the website is clicked, it becomes possible to extract ...

javascriptgoogle-chromegoogle-chrome-extension

Angular encountered an issue while attempting to access the property 'results' of an undefined value

I've got the code functioning perfectly, but for some reason I'm not getting any errors in the console log. It seems like I can't access results from an indefinite property. Any ideas on what could be causing this issue? I'm trying to m ...

javascriptangularapi

Enhancing the aesthetic appeal of a form

I have created a form in HTML that utilizes JavaScript to pull data from a database. I am looking to style the form, but I'm unsure of how to proceed. Below is the form along with some CSS code. How can I integrate the two together? <form id=" ...

javascripthtmlcss

You are unable to access the array beyond the scope of the function

I am encountering an issue with a function I wrote: function gotData(data){ result = data.val() const urls = Object.keys(result) .filter(key => result[key].last_res > 5) .map(key => ({url: 's/price/ ...

javascriptangularjsarraysnode.js

Generating a new display div element using an anchor link

I've set up a div container with a button that, upon clicking, adds a class to an element in my markup causing it to expand and take over the entire screen. Markup before: <section class="isi" data-trigger="toggle" data-trigger-class="isi--show-i ...

javascriptjquerycss

Encountering an error in Vue.js where a "cannot read property of undefined" message is displayed when attempting to use v

While attempting to use v-model on an array item's property, I encountered the error message "[Vue warn]: Error in render function: 'TypeError: Cannot read property 'viewFood' of undefined' when loading the page. This resulted in a ...

javascriptvue.jsvuejs2

Having trouble retrieving a value within the jQuery.ajax success function

I need to implement jQuery Validator in order to validate if a user's desired username is available during the sign-up process. The PHP script untaken.php is responsible for checking this, returning either ok if the username is free or taken if it is ...

javascriptjqueryjquery-validate

npm command syntax to accept multiple arguments

Struggling to pass arguments in an npm command and utilize them in my script For instance: npm run test -b chrome -e QA "scripts": { "test": "something.js ./xyz/abc/cdf --something \"{\\\"browser\\\": \&bsol ...

javascriptnode.jsnpm

Using JSON data in an Angular select dropdown menu with the ng-options directive

I need help figuring out how to format a JSON response from an AJAX request into a select statement using angular ng-options. Unfortunately, I cannot control the PHP source where the JSON response originates. The JSON response is structured as follows: ...

arraysjsonangularjsselectng-options

If the JSON file exists, load it and add new data without recreating the file or overwriting existing data

Currently, I am in the process of developing a function called createOrLoadJSON(). This function is responsible for checking whether an existing JSON file exists within the application. If the file does not exist, it should create a new file named "userDat ...

javascriptjsonvue.jsfilesystems

Determining the precise location of the div element

I am seeking to determine the precise positions of a div based on its class name. In the screenshot provided, my script for finding the div's position is highlighted in yellow, while the div I am targeting is highlighted in red at the bottom. Currentl ...

javascriptjqueryhtmlcsscss-position

Angular: Concealing a Component within a Controller

Being new to Angular, I am trying to figure out how to programmatically hide/show a component using the controller. I am having trouble understanding how to access my component and set ng-hide to false. Currently, my controller includes a service call. Af ...

javascriptangularcontroller

Use Javascript to create commands and variables specific to the domain or site of a webpage

Currently, I have implemented the code below to fetch the latest tweet. However, I am looking for a way to customize the TWITTERUSERNAME based on the domain where the template is being used. This template is shared across multiple domains. <script type ...

phpjavascriptjquery

The default value of the select option will not be displayed upon loading and will also not appear when another option is selected

I created a form using vue.js that includes a select option dropdown. However, the default value does not display when the form loads, and when a new option is selected from the dropdown, it also does not show. When I use v-for to loop through all options ...

javascriptvue.jsvuejs2

Enhance your webpage's body by zooming in using jQuery on Mozilla Firefox

I have a webpage and I would like to zoom its body when it loads using jQuery. However, the CSS zoom feature is not working in Mozilla Firefox. This is what I currently am using: $("body").css("zoom", "1.05"); It worked in Chrome, Opera, and Edge, but un ...

javascriptjqueryhtmlcss

Is there a way to display only the specific child div within the parent div using JavaScript without affecting the others?

   **** Sorry for the lengthy title **** Today I encountered a problem that I would like to discuss with all of you. When I click on a "COMMENT" button, instead of triggering JavaScript code to display a CHILD.div inside the corresponding ...

javascripthtml

Trigger the D3 component to re-render in React after a state change occurs in the parent component

My React project consists of two components written in TypeScript. The first component contains menus, and I am using conditional rendering to display different content based on user selection. <Menu.Item name="graph" active={activeItem ...

javascriptreactjstypescriptd3.js

Editing the dimensions of the input in Bootstrap 4

Is there a way to adjust the width of the input and select elements? I want the input element to take up more space while the select element occupies less space. <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel=" ...

javascripthtmlcsstwitter-bootstrapbootstrap-4

Displaying content on the <div> element

Looking for recommendations for a jQuery plugin or JavaScript solution that allows me to load a full "view" into a <div> when a user clicks on a link. The challenge I'm facing is that I have 8 pages, with the Homepage consisting of 3 divisions: ...

javascriptjqueryhtmlcssasp.net-mvc

Issue: The key length and initialization vector length are incorrect when using the AES-256-CBC encryption algorithm

Within my coding project, I have developed two essential functions that utilize the AES-256-CBC encryption and decryption algorithm: import * as crypto from "crypto"; export const encrypt = (text: string, key: string, iv: string) => { con ...

javascriptnode.jstypescriptencryption