Skip to content
This repository has been archived by the owner on Feb 22, 2018. It is now read-only.

Commit

Permalink
perf(view cache): Avoid http.get
Browse files Browse the repository at this point in the history
This change makes templateUrl component creation 100% faster.

It is a stop-gap until #1107 is fixed.

Closes #1108
  • Loading branch information
jbdeboer committed Jun 4, 2014
1 parent f32cac3 commit db72a4f
Show file tree
Hide file tree
Showing 6 changed files with 35 additions and 10 deletions.
4 changes: 4 additions & 0 deletions benchmark/web/tree-tmpl.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
<span> {{ctrl.data.value}}
<span ng-if="ctrl.data.right != null"><tree-url data=ctrl.data.right></span>
<span ng-if="ctrl.data.left != null"><tree-url data=ctrl.data.left></span>
</span>
10 changes: 10 additions & 0 deletions benchmark/web/tree.dart
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,15 @@ class TreeComponent {
var data;
}

@Component(
selector: 'tree-url',
templateUrl: 'tree-tmpl.html',
publishAs: 'ctrl')
class TreeUrlComponent {
@NgOneWay('data')
var data;
}


// This is a baseline implementation of TreeComponent.
// It assumes the data never changes and simply throws elements on the DOM
Expand Down Expand Up @@ -239,6 +248,7 @@ main() {

var module = new Module()
..type(TreeComponent)
..type(TreeUrlComponent)
..type(NgFreeTree)
..type(NgFreeTreeScoped)
..type(NgFreeTreeClass)
Expand Down
2 changes: 2 additions & 0 deletions benchmark/web/tree.html
Original file line number Diff line number Diff line change
Expand Up @@ -14,12 +14,14 @@
</p>

<div>Default: <input type=checkbox ng-model="useDefault"></div>
<div>From URL: <input type=checkbox ng-model="useUrl"></div>
<div>Baseline: <input type=checkbox ng-model="useBaseline"></div>
<div>Baseline + scope: <input type=checkbox ng-model="useBaselineScoped"></div>
<div>Baseline + class: <input type=checkbox ng-model="useBaselineClass"></div>


<tree ng-if="useDefault" data=initData></tree>
<tree-url ng-if="useUrl" data=initData></tree-url>

<ng-free-tree ng-if="useBaseline" data=initData></ng-free-tree>
<ng-free-tree-scoped ng-if="useBaselineScoped" data=initData></ng-free-tree-scoped>
Expand Down
12 changes: 10 additions & 2 deletions lib/core_dom/view_factory.dart
Original file line number Diff line number Diff line change
Expand Up @@ -118,6 +118,7 @@ class WalkingViewFactory implements ViewFactory {
@Injectable()
class ViewCache {
// _viewFactoryCache is unbounded
// This cache contains both HTML and URL keys.
final viewFactoryCache = new LruCache<String, ViewFactory>();
final Http http;
final TemplateCache templateCache;
Expand All @@ -138,8 +139,15 @@ class ViewCache {
}

async.Future<ViewFactory> fromUrl(String url, DirectiveMap directives) {
return http.get(url, cache: templateCache).then(
(resp) => fromHtml(resp.responseText, directives));
ViewFactory viewFactory = viewFactoryCache.get(url);
if (viewFactory == null) {
return http.get(url, cache: templateCache).then((resp) {
var viewFactoryFromHttp = fromHtml(resp.responseText, directives);
viewFactoryCache.put(url, viewFactoryFromHttp);
return viewFactoryFromHttp;
});
}
return new async.Future.value(viewFactory);
}
}

Expand Down
11 changes: 9 additions & 2 deletions lib/core_dom/web_platform.dart
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,14 @@ class PlatformViewCache implements ViewCache {
}

async.Future<ViewFactory> fromUrl(String url, DirectiveMap directives) {
return http.get(url, cache: templateCache).then(
(resp) => fromHtml(resp.responseText, directives));
ViewFactory viewFactory = viewFactoryCache.get(url);
if (viewFactory == null) {
return http.get(url, cache: templateCache).then((resp) {
var viewFactoryFromHttp = fromHtml(resp.responseText, directives);
viewFactoryCache.put(url, viewFactoryFromHttp);
return viewFactoryFromHttp;
});
}
return new async.Future.value(viewFactory);
}
}
6 changes: 0 additions & 6 deletions test/core/templateurl_spec.dart
Original file line number Diff line number Diff line change
Expand Up @@ -269,15 +269,9 @@ void main() {
'<style>.hello{}</style><div log="SIMPLE">Simple!</div>'
);

// Since the template cache is disabled, we expect a 'simple.html' call.
backend
..expectGET('simple.html').respond(200, '<div log="SIMPLE">Simple!</div>');

var element2 = e('<div><html-and-css>ignore</html-and-css><div>');
compile([element2], directives)(injector, [element2]);

microLeap();
backend.flush();
microLeap();

expect(element2.children[0].shadowRoot).toHaveHtml(
Expand Down

0 comments on commit db72a4f

Please sign in to comment.