Giter Club home page Giter Club logo

vscode-mezzurite's Introduction


logo
Mezzurite SDK Extension for Visual Studio Code

This plugin improves the Mezzurite SDK implementation experience. The Mezzurite SDK provides a consistent way to collect performance metrics of Single Page Applications across a variety of frameworks. Learn more about Mezzurite by visiting our GitHub Repository!

Features

Components Tracking

Displaying the marked and unmarked components for performance tracking from the application code currently active in editor workspace.

Updates in Component Tracking Status on the fly whenever a component file or its external html template is changed, deleted or a new component is created.

Demo

Components Demo

Modules Tracking

Displaying the modules configured with mezzurite performance markers to capture ALT and VLT for the application code currently active in editor workspace.

Updates in Modules Tracking Status on the fly whenever a module file is changed, deleted or a new module is created. Hovering over the module name displays the missing condition to track that module.

Demo

Modules Demo

RoadMap

We are working on to provide the following features:-

Intellisense and autocomplete

Suggestion are provided for mezzurite syntaxes while typing imports and other mezzurite syntaxes. Code completion would be performed automatically while hitting Ctrl+Space on specific syntaxes.

Verifying Loggers

This feature verifies whether logging options for captured metrics is enabled or not. This also provides suggestions on required mandatory properties in logging config.

Configuration

This extension will be Activated automatically for the active workspace in vs code editor, provided the workspace have a mezzurite dependency.

Installation

To install, click on the "Install" button above and open with visual studio code, which will bring up the Extensions view in the editor.

You can also reach to this page by clicking on the Extensions icon in the Activity Bar on the side of VS Code or the command Ctrl+Shift+X and typing "mezzurite" keyword in the search bar.

After a successful install, you'll see a Reload button. Clicking on this will restart VS Code to enable the extension.

Limitations

  • Currently tracking Components and Modules feature is only supported for mezzurite-angular framework.
  • Explorer views are fixed and therefore are always visible. In the case of React, the modules section would not be needed.

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

License

Copyright (c) Microsoft Corporation. All rights reserved. Licensed under the MIT License.

Support

For more information and feedback on Mezzurite and its extensions. Please contact us at:- [email protected]

vscode-mezzurite's People

Contributors

brrusino avatar cn894 avatar dependabot[bot] avatar kawwong avatar manpatel3107 avatar microsoftopensource avatar msftgits avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

vscode-mezzurite's Issues

Move the file checking into a separate module

This is a broader conversation of moving the file checking functionality into a separate module that can be configured in terms which files to run tests on, what kind of coverage logs to generate, etc. The language server would just import that module and send the results to the client to display. This separates the responsibilities of the vscode extension versus a coverage utility that could possibly be run in a continuous integration environment.

This module could include some of the following features:

Be run from a CLI
Generate coverage statistics
Be configurable for which files to include/exclude
Generate application/component timings in a synthetic environment

Consider integrating telemetry

Do we want some way of reporting user crash dumps? It looks like there's an existing package that assists with that, or we can find a different/custom solution.

Bundle the source files with Webpack

As per the docs, reducing the number of files being loaded will improve the startup performance of the extension. As this extension is written using the language client/server protocol, it will need to be bundled into 2 different bundles: one for the client, and one for the server.

Use chokidar instead of globby and client events

Currently, the server starts up and crawls all the files in the directory and runs coverage on those files. Afterwards, the server listens for the client to send events using the vs code API to see if a file was deleted or changed. Chokidar is able to do this by just listening to the workspace and emitting events. This way, changes can be detected even when made by an external program, like git. This also eliminates the need for the client to request a recalculation to the server, as chokidar will be able to pick it up and send it to the client.

Verify that Mezzurite is installed

Related to #39, we can use chokidar to look inside package.json or node_modules to detect whether or not a the project has a Mezzurite dependency. This check would prevent the extension from doing the calculations on the workspace folders without a dependency on Mezzurite. Potentially, this could also hide the Mezzurite treeview or tab if it didn't exist.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.