I am currently working on a React web application which makes heavy use of the fetch API and promises. Yesterday I reasoned about if it might lead to problems if you do not cancel a promise which is not of any use any more.

This might be the case if a React component initiates a fetch based upon one of it’s properties (props) it received from it’s parent and the props change while the fetch request has not been completed. Well, I have written a little proof of concept which shows that it is important to think about cancelling promises as soon as they are not needed anymore. Otherwise this might lead to an inconsistent UI state. The code of the PoC can be found here. A live demo can be found here.

Well, this leads to the question how one should actually cancel fetch requests and promises. You can find hints about this topic on the following site:

• Abortable fetch
• isMounted is an Antipattern