feat(deck adapter) wait for async layers to load #161
Conversation
Pull Request Test Coverage Report for Build 1243641288
💛 - Coveralls |
| @@ -127,7 +127,8 @@ export default class DeckAdapter { | |||
| * @param {(nextTimeMs: number) => void} proceedToNextFrame | |||
| */ | |||
| onAfterRender(proceedToNextFrame) { | |||
| if (this.videoCapture.isRecording()) { | |||
| const areAllLayersLoaded = this.deck.props.layers.every(layer => layer.isLoaded); | |||
There was a problem hiding this comment.
Very nice! By defining customRender you should be able to prevent rendering from happing until you are ready: https://github.com/visgl/deck.gl/blob/master/modules/core/src/lib/deck.js#L347
There was a problem hiding this comment.
That would mainly be an optimization to prevent wasted work....
There was a problem hiding this comment.
Would I call the private this._drawLayers(redrawReason); when I want to eventually render?
There was a problem hiding this comment.
Made an issue to continue that work. Merging as-is for now since it's an improvement to the current renderer.
Pull Request Test Coverage Report for Build 1243641288Warning: This coverage report may be inaccurate.This pull request's base commit is no longer the HEAD commit of its target branch. This means it includes changes from outside the original pull request, including, potentially, unrelated coverage changes.
Details
💛 - Coveralls |
Currently the render handler on a hubble/deck adapter (
adapter.onAfterRender) is expected to be called after every deck.gl render update (deck.onAfterRender), or if using mapbox/deck integration, on every map render event [0]. Our testing suggests a render update occurs every time a layer's data updates (including any internal asynchronous data update, such as tile loading). So, hubble can wait until the render update call where all deck layers are loaded, and then capture the frame.Changelog
The current Hubble implementation can already wait for a number of internal flags before progressing the animation manager to the next frame, so we can add one more.
After this PR, the "wait" flags will be:
Is hubble currently supposed to be recording?
hubble.gl/modules/core/src/adapters/deck-adapter.js
Line 130 in 31f5db5
truewhenadapter.render()is called until eitheradapter.stop()interrupts a recording, or a recording reaches thetimecode.endframe. Whichever happens first.[New flag] Is all deck data loaded?
Is hubble already capturing a frame?
hubble.gl/modules/core/src/capture/video-capture.js
Line 88 in 31f5db5
trueuntil a promise resolves.Demo
Before: Notice the black artifacts where data isn't loaded, and the black frames around second 7.
before_deck_loaded.mp4
After: No artifacts or skipped frames. A frame is only captured when all deck layers are loaded. 🎉
after_deck_loaded.mp4
Note: These videos are exported with the webm encoder and locally recompressed with ffmpeg.
ffmpeg -i after_deck_loaded.webm -vcodec libx264 -crf 23 -pix_fmt yuv420p -tune animation after_deck_loaded.mp4[0] Look for:
map.on('render', () => {adapter.onAfterRender(...)}). In this PR only the deck render update will be addressed, and mapbox will need further investigation.