Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove seer integration #3940

Merged
merged 3 commits into from
Nov 28, 2019
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 0 additions & 12 deletions docs/developer-guide/debugging.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,13 +26,6 @@ deck.log.priority = 2
| 3+ | Additional logging around layer lifecycle, prop diffing etc |


## Seer Integration

deck.gl is integrated with the [Seer Chrome Extension](https://chrome.google.com/webstore/detail/seer/eogckabefmgphfgngjdmmlfbddmonfdh?hl=en). Simply installing Seer and rerunning your application opens up a new "Seer" tab in the Chrome developer tools, providing you with the ability to see all your deck.gl layers, inspect (and edit) their properties and attributes and check per layer timings, such as the latest GPU draw calls or attribute updates.

Since luma.gl v4 also has a Seer integration, it is possible to follow links from deck.gl layer to luma.gl models inside Seer, enabling you to further drill down and understand what data is ultimately being generated and processed by the GPU.


## WebGL debugging using luma.gl

For lower level debugging, including debugging of layer rendering and picking, deck.gl is built on luma.gl which has extensive debugging and instrumentation support for WebGL level code and GPU input values (shader uniforms and attributes). To enable debug logging simply issue the following commands in your browser console:
Expand All @@ -56,8 +49,3 @@ In the browser console, setting `luma.log.priority` to various values will enabl
| 1 | Minimal logging |
| 2 and 3 | Will display all uniforms and attributes before each draw call, allowing you to be confident in what values your shaders are actually working on. |
| 4 | Will trace every single gl call.


## Remarks

* Seer remembers its "on/off" setting across application reloads. This is significant because it means that the Seer extension can be left installed even in heavy deck.gl applications with lots of layers, and turned on only during debugging, without any performance impact during normal usage.
3 changes: 1 addition & 2 deletions modules/core/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,6 @@
"gl-matrix": "^3.0.0",
"math.gl": "^3.0.0",
"mjolnir.js": "^2.1.2",
"probe.gl": "^3.1.1",
"seer": "^0.2.4"
"probe.gl": "^3.1.1"
}
}
46 changes: 0 additions & 46 deletions modules/core/src/lib/layer-manager.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,6 @@

import assert from '../utils/assert';
import {Timeline} from '@luma.gl/core';
import seer from 'seer';
import Layer from './layer';
import {LIFECYCLE} from '../lifecycle/constants';
import log from '../utils/log';
Expand All @@ -30,14 +29,6 @@ import {Stats} from 'probe.gl';
import Viewport from '../viewports/viewport';
import {createProgramManager} from '../shaderlib';

import {
setPropOverrides,
layerEditListener,
seerInitListener,
initLayerInSeer,
updateLayerInSeer
} from './seer-integration';

const LOG_PRIORITY_LIFECYCLE = 2;
const LOG_PRIORITY_LIFECYCLE_MINOR = 4;

Expand Down Expand Up @@ -94,26 +85,15 @@ export default class LayerManager {

this.activateViewport = this.activateViewport.bind(this);

// Seer integration
this._initSeer = this._initSeer.bind(this);
this._editSeer = this._editSeer.bind(this);

Object.seal(this);

seerInitListener(this._initSeer);
layerEditListener(this._editSeer);
}

// Method to call when the layer manager is not needed anymore.
// Currently used in the <DeckGL> componentWillUnmount lifecycle to unbind Seer listeners.
finalize() {
// Finalize all layers
for (const layer of this.layers) {
this._finalizeLayer(layer);
}

seer.removeListener(this._initSeer);
seer.removeListener(this._editSeer);
}

// Check if a redraw is needed
Expand Down Expand Up @@ -310,12 +290,10 @@ export default class LayerManager {
if (!oldLayer) {
const err = this._initializeLayer(newLayer);
error = error || err;
initLayerInSeer(newLayer); // Initializes layer in seer chrome extension (if connected)
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we could leave a hook here, something like LayerManager.callbacks.onInitialize, it will allow users to add back similar functionalities using an external module.

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we could leave a hook here, something like LayerManager.callbacks.onInitialize, it will allow users to add back similar functionalities using an external module.

I like that proposal! I am playing with the idea of setting up some open source "dot-gl" libraries from Unfolded's side that could contain some of the more experimental code that is being cut from the core libraries, plus some new stuff that we are developing that would be complementary to the existing frameworks.

That way the vis.gl core libraries could go ahead focus on being really small and hardened, but also provide the extensibility hooks so that we can continue to build out more experimental and advanced functionality (and if and when that matures we can always go back and make it official parts of the suite).

} else {
this._transferLayerState(oldLayer, newLayer);
const err = this._updateLayer(newLayer);
error = error || err;
updateLayerInSeer(newLayer); // Updates layer in seer chrome extension (if connected)
}
generatedLayers.push(newLayer);

Expand Down Expand Up @@ -432,28 +410,4 @@ export default class LayerManager {
log.log(LOG_PRIORITY_LIFECYCLE, `finalizing ${layerName(layer)}`)();
return error;
}

// SEER INTEGRATION

/**
* Called upon Seer initialization, manually sends layers data.
*/
_initSeer() {
this.layers.forEach(layer => {
initLayerInSeer(layer);
updateLayerInSeer(layer);
});
}

/**
* On Seer property edition, set override and update layers.
*/
_editSeer(payload) {
if (payload.type !== 'edit' || payload.valuePath[0] !== 'props') {
return;
}

setPropOverrides(payload.itemKey, payload.valuePath.slice(1), payload.value);
this.updateLayers();
}
}
3 changes: 0 additions & 3 deletions modules/core/src/lib/layer.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,6 @@
/* eslint-disable react/no-direct-mutation-state */
import {COORDINATE_SYSTEM} from './constants';
import AttributeManager from './attribute/attribute-manager';
import {removeLayerInSeer} from './seer-integration';
import UniformTransitionManager from './uniform-transition-manager';
import {diffProps, validateProps} from '../lifecycle/props';
import {count} from '../utils/count';
Expand Down Expand Up @@ -631,8 +630,6 @@ export default class Layer extends Component {
for (const extension of this.props.extensions) {
extension.finalizeState.call(this, extension);
}
// End lifecycle method
removeLayerInSeer(this.id);
}

// Calculates uniforms
Expand Down
135 changes: 0 additions & 135 deletions modules/core/src/lib/seer-integration.js

This file was deleted.

4 changes: 0 additions & 4 deletions modules/core/src/lifecycle/create-props.js
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
import {applyPropOverrides} from '../lib/seer-integration';
import log from '../utils/log';
import {isAsyncIterable} from '../utils/iterable-utils';
import {parsePropTypes} from './prop-types';
Expand Down Expand Up @@ -43,9 +42,6 @@ export function createProps() {
checkDeprecatedProps(layerName, propsInstance.updateTriggers, deprecatedProps);
checkDeprecatedProps(layerName, propsInstance.transitions, deprecatedProps);

// SEER: Apply any overrides from the seer debug extension if it is active
applyPropOverrides(propsInstance);

// Props must be immutable
Object.freeze(propsInstance);

Expand Down
1 change: 0 additions & 1 deletion test/modules/core/lib/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,6 @@ import './layer-manager.spec';
import './tooltip.spec';
import './transition-manager.spec';
import './uniform-transition-manager.spec';
import './seer-integration.spec';
import './effect.spec';
import './effect-manager.spec';
import './picking.spec';
Expand Down
26 changes: 0 additions & 26 deletions test/modules/core/lib/seer-integration.spec.js

This file was deleted.