11436 SSO

Top Seven Proxy Editor Improvements to Apigee Edge

marsh
Jul 22, 2015

UI frameworks have evolved a ton since we launched Apigee Edge three years ago. About a year ago, we standardized on Angular for our web application UIs. However, migration always takes time and effort, and because of the proxy editor’s complexity, it was the last component that remained of the legacy Edge UI. With the latest release of Edge, this migration from Backbone is complete, and the new visual proxy editor has become the default experience. While it’s still possible to access the old version of the editor, we plan to remove it in a future build.

During this development effort, we reduced the lines of code by over 60%—just for the proxy editor alone—even as we increased our test coverage. Even better, it is much easier to work with our new code base, making it simpler to add and improve features.

We took advantage of this rewrite to make some usability improvements. There are many little details you'll notice as you use it, but here are the top seven changes:

1. Better use of vertical space in the map pane

The first section we revisited was the map view, since the old version was a bit bulky. By tightening up how policies are presented in a flow, we created more room for working with policy configuration details without sacrificing any usability in the map.

 

2. Folding sections in the editor

In the policy configuration pane, you can now fold sections, which makes working with longer documents a much nicer experience.

 

3. Improved context for action buttons

In the old proxy editor, when you needed to add anything, you'd have to visit the "New" menu to do so:

 

But with the new editor, you have "Add" or "+" buttons in the context of the kinds of things you're adding:

 

By moving these buttons into their related sections, this makes adding policies, flows, proxies, and targets much more intuitive.

4. Script listing improvements

Instead of interpreting the type of file, we now use the file extension and folder structure to present the assets in the scripts directory. This makes it easier to find the file you're looking for.

 

5. Search across the proxy configuration

We added a search function, which makes it easier to find keywords in policies and flows:

 

 

6. A tightened-up Overview tab

Over time, we had added a number of items to the Overview tab. Now, it's been re-organized to focus specifically on the high-level overview of your proxy. The section formerly called "Resources" now more accurately represents the "Conditional Flows" that you have defined for your proxy.

 

7. Dedicated space for performance visualizations

Performance outgrew the Overview section and now has it's own tab. Special attention was given to improving the interactions for investigating performance:

 

 

Bonus! Find orphaned policies quickly

While it's not new with this release, did you know that policies that haven’t been attached to a flow have a visual treatment? This makes it easy to identify orphaned policies and keep your proxies lean.

 

The new proxy editor became available in May and will be included in the 15.07 Edge for Private Cloud release. If you have any questions or feedback, please get in touch at community.apigee.com.

Microservices Done Right

Next Steps

 
 

Resources Gallery

News