如何知道dart聚合物元素何时完全渲染

时间:2014-01-07 03:59:56

标签: dart dart-polymer

我创建了一个聚合物元素,用于从数据源URL中绘制数据表。代码位于https://github.com/dennisfrancis/polymer-dart-datatable-example

我的目标是测量聚合物元素在客户端获得新数据后完全呈现自己所花费的时间。我尝试了以下但没有成功。

/**
 * A Polymer datatable element.
 */
@CustomTag('dennis-datatable')
class DataTable extends PolymerElement {

  ....
  ....
  @observable int numrows = 0;
  @observable int numcols = 0;
  @observable List<String> cols;
  @observable List<Map<String,dynamic>> rows;

  .....
  .....      
  DateTime start_render;
  DateTime stop_render;

  DataTable.created() : super.created() {
    ....
    this.shadowRoot.addEventListener("load", prn_latency);
    fetch_data();
    ....
  }

  void fetch_data([Timer _]) {

    ....
    .....
    HttpRequest request = new HttpRequest(); // create a new XHR

    // add an event handler that is called when the request finishes
    request.onReadyStateChange.listen((_) {
      if (request.readyState == HttpRequest.DONE &&
          (request.status == 200 || request.status == 0)) {

        update_data(request.responseText);

      }

    });

    request.open(method, dataSrc);

    if(method == "POST") {
      request.send(jsonArgs); // perform the async POST
    } else {
      request.send();
    }

  }

  void prn_latency(Event e) {
    if (start_render == null) { return; }
    stop_render = new DateTime.now();
    int diff = stop_render.millisecondsSinceEpoch - start_render.millisecondsSinceEpoch;
    print("render time = $diff ms");
  }

  void update_data(String jsonString) {

    Map data = JSON.decode(jsonString);
    numrows = data["numrows"];
    numcols = data["numcols"];
    cols    = data["cols"];
    rows    = data["rows"];

    this.start_render = new DateTime.now();

  }
}

1 个答案:

答案 0 :(得分:0)

我认为attached()电话后的super()是最佳选择。

  void attached() {
    super.attached();
    // stop_render
  }

如果您希望在start_render来电之前将polymerCreated()放入元素super(),那么

  void polymerCreated() {
    // start_render
    super.polymerCreated()
  }