324
Views
1
Comments
OnDestroy - if not remove a Javascript function e.g.eventlistener or SetInterval
Question
Application Type
Mobile
Service Studio Version
11.53.13 (Build 61176)

This function is defined on a screen.

SetInterval (function() {

    $actions.DisplayOption();

}, 1000);

If it is not removed in OnDestroy, it will log an error in Service log but not throw an exception error in Outsystems or something in console log (I tested it). 

I found this information on internet:

https://www.outsystems.com/forums/discussion/68640/reactive-remove-js-event-listener-with-anonymous-function/ 

https://stackoverflow.com/questions/62865184/what-happens-if-i-dont-removeeventlistener-javascript

The main reason you should remove event listeners before destroying the component which added them is because once your component is gone, the function that should be executed when the event happens is gone as well (in most cases) so, if the element you bound the listener to outlasts the component, when the event happens you'll get an error, as the code to be executed is nowhere to be found. Also memory leaks.

While this is most times an edge case, it tends to generate bugs which are particularly hard to debug.

On top of that, in a SPA (which is the most common usage of Vue applications) not removing listeners can quickly become a performance issue.


In a multi questionnaire there are e.g. these two options:

  • Will throw an error every 1 second because the code is not there anymore
  • Will not throw an error

What is the correct answer?




UserImage.jpg
Elizabeth Marais

Correction on above, I notice an error is logged in Console:

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.