Managing memory in UIWebView when rendering THREE.js scenes

I am currently working on a game using THREE.js that will be embedded into a UIWebView within an iOS8 app.

After analyzing the application in Chrome's developer tools, I have confirmed that there are no memory leaks present. The memory usage reaches a certain point and remains consistent throughout.

However, when running the application in UIWebView, I noticed that the memory usage gradually increases over time, indicating a lack of garbage collection.

Despite my research online, I could not definitively determine whether iOS8 UIWebView implements garbage collection. Some sources claim it does, while others argue otherwise. If it does indeed include garbage collection, how can I activate it?

If garbage collection is unavailable, my current workaround involves periodically terminating or deallocating the UIWebview, and then restarting the application (specifically at the menu screen for a game).

UPDATE:

Further investigation revealed that deallocating the UIWebView does not resolve the issue - the system fails to deallocate all resources (even after trying various techniques) leading to exacerbated memory problems.

The uncertainty regarding UIWebView's mark/sweep garbage collection persists, although data from the Profile/Instruments panel suggests its presence. However, the memory usage rarely decreases. Logically, some form of garbage collection must occur as temporary objects in code and out-of-scope entities do get cleaned up.

It appears that my THREE.js elements are not being properly collected, possibly due to the need to manually dispose of resources (such as GL-related handles) according to THREE.js protocols.

Anomalies related to .bind(this) function remain problematic - functions initialized with setTimeout(object.func.bind(object), 100) seem to persist even after dispatching the timeout. As a result, I preemptively bind and store these functions as variables instead. Similarly, jQuery event handlers encounter similar issues.

To address memory management in my two-scene game setup (with menu and game scenes), I opted to retain both scenes in memory indefinitely rather than removing them. Objects and models created during gameplay are recycled instead of relying solely on garbage collection. When an object is removed from the scene, it is placed in a pool of similar objects for future re-initialization and addition back into the scene when needed. While this approach initially seemed excessive, it has proven effective in preventing memory leaks and expediting object creation and addition to the scene.

Answer №1

Memory expansion occurs when certain elements are retained in the memory as a result of the HTTP cache strategy. As long as the memory does not continue to expand indefinitely, there is no cause for concern.

Answer №2

It appears that there is a issue in iOS8 where the memory isn't being properly freed by the garbage collector. I discussed this problem in detail on this thread: PhoneGap experiencing excessive memory usage in iOS8 compared to iOS7

If possible, please report this bug to Apple so it can be addressed in the upcoming OS update.

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

After clicking the submit button, make sure to automatically fill in all empty input fields

I am currently working on a form that includes various input types such as text fields, radio buttons, select dropdowns, and text areas. The form is displayed in a table format with an option to add additional rows. One issue I have encountered is that us ...

Enhancing Clarity in Three.js ShaderMaterial Fragment Shader

I have been using Three.js extensively, but I am now delving into the world of shaders. Currently, I have a green cube that is partially transparent, achieved using a THREE.ShaderMaterial based on the "phong" ShaderLib. To test the transparency, I placed a ...

Designated location for downloading specified by the user

I've been searching for a while now and I can't seem to find a satisfactory answer. Essentially, I have a website where users can input values and download a specific file based on those values. Everything is functional, but I want to give the u ...

Preview of Live Iframe Display

Currently, I am in the process of developing a node.js website that enables users to create and customize their own page using a dashboard interface. One specific feature I would like to incorporate is a live preview capability, similar to what Shopify o ...

Steps for eliminating QRcode warning in npmjs package

Issue: Warning Message (node:24688) ExperimentalWarning: buffer.Blob is an experimental feature. This feature could change at any time (Use `node --trace-warnings ...` to show where the warning was created) Seeking Solution: How can I prevent this warning ...

Multiple occurrences of setting the state on an array result in logging an empty array each

My current challenge involves fetching data from a backend server and storing it in an array. However, when I attempt to pass this array to another component, I encounter an issue where multiple empty arrays are being passed instead of one filled with data ...

Issue with React Hook Form - frequent failure in submitting the form

I have implemented the useForm hook from https://www.npmjs.com/package/react-hook-form. However, I am encountering some inconsistent behavior where it sometimes works immediately, sometimes requires a page refresh to work, and sometimes doesn't work a ...

Accessing JSON files locally using JavaScript in IE and Firefox

I am a beginner in JavaScript and currently working on a small HTML page that will be run locally. I have a string in JSON format that I need to store and load as a file on the hard drive. I have managed to store the string using the following code snippe ...

Using a straightforward approach with v-model in vue.js on an href element instead of a select

Is there a way to utilize an href-link instead of using <select> to switch languages with vue.i18n? <a @click="$i18n.locale = 'en'">EN</a> <a @click="$i18n.locale = 'da'">DA</a> ...

Text alignment in a UITableViewCell with a combination of accessory views

In my UITableViewCell, I have a unique background image and the text is centered within the cell. Some rows have the UITableViewCellAccessoryDetailDisclosureButton to indicate additional details for that specific row. The issue arises when using this acce ...

Tips for applying stroke and shadow effects specifically when the mouse is moving over a canvas:

How can we create a shadow and stroke effect for circles drawn using HTML canvas only during mouse hover? I have two circles and would like to add a shadow and stroke effect when the mouse hovers over them. However, the issue is that once the mouse moves ...

Disabling eslint does not prevent errors from occurring for the unicorn/filename-case rule

I have a file called payment-shipping.tsx and eslint is throwing an error Filename is not in camel case. Rename it to 'paymentShipping.tsx' unicorn/filename-case However, the file needs to be in kebab case since it's a next.js page that s ...

Equal-sized tiles in Highchart treemaps

I'm attempting to display JSON data in treemaps with equal squares. I discovered that the highchart-treemap library offers four built-in algorithms - squarified, slice and dice, stripes, and strip. However, none of these algorithms provide me with the ...

One function is failing to execute properly due to multiple if conditions

Take a look at my JavaScript code below: function showLater1() { if ((vidos.currentTime >= 30) && (vidos.currentTime <= 34)) { lay.style.opacity = "1"; content.style.opacity = "0"; controls.style.opacity = "0"; ...

Is it possible for Typescript to resolve a json file?

Is it possible to import a JSON file without specifying the extension in typescript? For instance, if I have a file named file.json, and this is my TypeScript code: import jsonData from './file'. However, I am encountering an error: [ts] Cannot ...

What steps should be taken to prepare data for transmission to a server in a Next.js environment?

I'm in the process of creating a website that requires authentication. I am using Next (React) and typescript for web development. My objective is to make most pages ServerSideRendered or StaticHTML. However, I encountered an issue right at the begin ...

Is there a way to restrict the number of times I can utilize slideToggle function?

When I continuously click on a div element in an HTML website that triggers the .slideToggle() method, it will keep opening and closing for as many times as I click. The problem arises when I stop clicking, as the <div> continues to toggle open and c ...

Comment sections that refresh automatically after being posted

I am determined to provide a clear explanation. Despite having some code, I am uncertain about how to make it clone comments and add new ones with user inputted text. Below is the snippet of code I am struggling with: <!DOCTYPE html> <!-- this i ...

Set the title attribute according to the content of the <p> tag

Recently, I encountered a situation where I had numerous p tags with a specific class (let's call it .text). My task was to include the title attribute containing the text of each tag. For example: <p> Hello, world </p> This would resul ...

What is the best way to handle query string parameters when routing in Next.js?

One of the challenges I am facing is related to a URL structure like this: bar?id=foo When I navigate to this URL using router.push('bar?id=foo'), everything works perfectly. However, if I directly access the route in the browser, the query st ...