Hiya, ![]()
I’m encountering a rendering challenge in Cocos Creator 3.8.6 and three.8.7 that solely happens on iOS 26 Net browsers.
Challenge Surroundings
- 2D mission
- Backbone character animations (e.g., eye slots)
- BMFont (PNG-based)
- Net construct
- Solely default built-in shaders used
- No alpha masking or stencil operations used
Signs
- Small Backbone slots (e.g., eyes) randomly don’t seem
- Some characters don’t show them initially
- Regenerating the character restores the lacking slots
- Each Label and RichText use BMFont, however generally the final Label or RichText to be rendered fails to show randomly.
- Works effective on Android and iOS 16 / 18 net browsers
- Solely happens on iOS 26 Net browsers (not restricted to Safari)
- Unrelated to scene transitions or useful resource launch
- Happens randomly when DpCall is round 30–80
- Probability will increase because the variety of characters on display grows (examined with 16 characters)
Makes an attempt to Repair
- Disabled Atlas Trim/Rotation choice
- Disabled Backbone Premultiplied Alpha
- Examined on newest iOS 26 net browsers
- Upgraded Cocos from 3.8.6 → 3.8.7
- Compelled WebGL1 construct
Consequence: Regardless of all makes an attempt, the difficulty persists solely on iOS 26 WebGL1 browsers, the place particular slots or characters fail to render.
Has anybody else skilled the identical challenge when testing Net builds on iOS 26?
Listed below are two latest makes an attempt I made to cope with the rendering challenge:
1. Calling capabilities like markForUpdateRenderData after setting a node energetic
public static refreshAll(node: Node, withDelay: boolean = true) {
const doRefresh = () => {
// ----- Sprite -----
node.getComponents(Sprite).forEach((c) => {
c.markForUpdateRenderData();
c.colour = c.colour; // Safari soiled trick
});
// ----- Label -----
node.getComponents(Label).forEach((c) => {
c.updateRenderData(true);
c.markForUpdateRenderData();
c.colour = c.colour; // Safari soiled trick
});
// ----- RichText -----
node.getComponents(RichText).forEach((wealthy) => {
// Reassign the identical worth to set off soiled flag
wealthy.string = wealthy.string;
// Pressure replace baby labels inside RichText
wealthy.node.youngsters.forEach((baby) => {
const lbl = baby.getComponent(Label);
if (lbl) {
lbl.updateRenderData(true);
lbl.colour = lbl.colour; // Safari soiled trick
}
});
});
// ----- Backbone -----
const spines = node.getComponents("sp.Skeleton") as any[];
spines.forEach((c: any) => {
if (c.markForUpdateRenderData) {
c.markForUpdateRenderData();
}
if (c.invalidAnimationCache) {
c.invalidAnimationCache();
}
c.node.setScale(c.node.scale.x, c.node.scale.y); // Safari soiled trick
});
// ----- Node scale soiled trick -----
node.setScale(node.scale.x, node.scale.y);
// ----- Recursively refresh youngsters -----
node.youngsters.forEach((baby) => this.refreshAll(baby, false));
};
if (withDelay) {
setTimeout(doRefresh, 0); // Run on the subsequent body
} else {
doRefresh();
}
}
2. Forcing a draw by calling gl.flush() after Director.EVENT_AFTER_DRAW
const canvas = doc.querySelector("canvas") as HTMLCanvasElement;
const gl = canvas.getContext("webgl2") || canvas.getContext("webgl");
if (gl) gl.flush();
In each circumstances, there was some impact (beforehand invisible parts began displaying up), however when a number of objects didn’t render, these tips weren’t enough to repair the difficulty fully.
Provided that iOS 26 initially struggled with overheating issues, I think Apple might need launched some inner optimizations or adjustments in later patches, which could possibly be the underlying reason behind this conduct.
When utilizing the Additive BlendMode for Backbone animations on iOS 26, sure components don’t render accurately.
This challenge appears separate from the UI font not rendering drawback, however the signs seem comparable, so I needed to report it right here.
Utilizing a system font or a dynamic font (like a TTF) as an alternative of a BMFont can repair the difficulty the place textual content shouldn’t be seen.
I encountered the identical drawback. Did you discover a answer?
@nizakifx
I haven’t discovered an actual answer but. Within the recreation, I’m making an attempt to maintain the draw calls beneath 30, and for circumstances occurring within the UI, I’m avoiding the difficulty through the use of System Fonts as an alternative of BMFont.
We additionally encountered the entire drawback, which troubled us for 2 months


