滚动.gif

对于任何技术栈，都会有一个绕不过去的坎，那就是性能优化，而对于如何进行性能优化，最重要的前提就是需要知道具体的耗时分布，要知道耗时分布，就得打点（时间戳），一般的性能打点都是一些散点，比较凌乱，而本文要讲的 Tracing 则是性能打点的一种非常优雅的实现，它以瀑布流的形式呈现，非常直观，还有一个更直观的名字叫火焰图

Tracing 顾名思义 —— 追踪每段耗时分布。

背景

上面这张图是 Flutter Engine 初始化过程中的一部分流程，非常直观的反应了执行流程中每个阶段的耗时分布。

Tracing 是 Chrome 开发者工具中强大的性能分析工具之一，它能记录 Chrome 所有进程间的各种活动。例如能记录每个进程中每个线程里 C++ 或者 JavaScript 方法的调用栈/耗时，不仅仅如此，还能看到视图 Layer 之间的层级关系，相关文档介绍 The Trace Event Profiling Tool (about:tracing)。

本文会专注在 Flutter Engine 中 Tracing 原理与实践，会分为原理篇与实践篇，原理篇会涉及到具体实现，实践篇主要包括如何使用、分析、定制。

⚠️：Flutter 中用 Timeline 这个词代替了 Tracing，Flutter Devtool 也提供了 Timeline 工具（展示的就是 Tracing 结构的信息）。这两个词是一个对等的概念，下文提到的 Timeline 可以和 Tracing 对等。

原理篇

整个 Timeline 的过程主要包括初始化 Timeline 与记录 Tracing 信息两个部分。

▐ 初始化 Timeline

初始化 Timeline 包括四个过程：注册 Flag、设置 Flag、TimelineStream 初始化、Timeline 初始化。
注册 Flag

Flutter 中会注册非常多的 Flag 用于各种功能标记，对于 Timeline/Tracing 功能就是 timeline_streams 标实，具体如下：

/path/to/engine/src/third_party/dart/runtime/vm/timeline.cc

// 执行宏定义
DEFINE_FLAG(charp,
            timeline_streams,
            NULL,
            "Comma separated list of timeline streams to record. "
            "Valid values: all, API, Compiler, CompilerVerbose, Dart, "
            "Debugger, Embedder, GC, Isolate, and VM.");

// 展开后：
charp FLAG_timeline_streams = Flags::Register_charp(&FLAG_timeline_streams, 'timeline_streams', NULL, "Comma separated list of timeline streams to record. "
            "Valid values: all, API, Compiler, CompilerVerbose, Dart, "
            "Debugger, Embedder, GC, Isolate, and VM.");

其中 charp 为 typedef const char* charp;

真正执行的函数如下：

/path/to/engine/src/third_party/dart/runtime/vm/flags.cc

const char* Flags::Register_charp(charp* addr,
                                  const char* name,
                                  const char* default_value,
                                  const char* comment) {
  ASSERT(Lookup(name) == NULL);
  Flag* flag = new Flag(name, comment, addr, Flag::kString);
  AddFlag(flag);
  return default_value;
}

其中 addr_ 是一个 union 成员，初始值为当前注册函数的默认值为 NULL，即 FLAG_timeline_streams 初始值为 NULL。

设置 Flag

在 Flutter Engine 初始化的过程中，可以进行 DartVm 参数的透传，例如 —trace-startup，这个参数就可以记录启动时 Tracing 信息，会由如下方法进行设置：

path/to/engine/src/flutter/runtime/dart_vm.cc

char* flags_error = Dart_SetVMFlags(args.size(), args.data());

最终调用方法：

/path/to/engine/src/third_party/dart/runtime/vm/flags.cc

char* Flags::ProcessCommandLineFlags(int number_of_vm_flags,
                                     const char** vm_flags) {
...
while ((i < number_of_vm_flags) &&
         IsValidFlag(vm_flags[i], kPrefix, kPrefixLen)) {
    const char* option = vm_flags[i] + kPrefixLen;
    Parse(option);
    i++;
}
...
}

这里主要会进行 Flag 的有效性验证，关键步骤为 Parse 方法中的 SetFlagFromString

bool Flags::SetFlagFromString(Flag* flag, const char* argument) {
  ASSERT(!flag->IsUnrecognized());
  switch (flag->type_) {
    ...
    case Flag::kString: {
      *flag->charp_ptr_ = argument == NULL ? NULL : strdup(argument);
      break;
    }
    ....
  }
  flag->changed_ = true;
  return true;
}

会针对不同 Flag Type 设置不同变量，而这些变量是一个 union 结构体，如下：

union {
    void* addr_;
    bool* bool_ptr_;
    int* int_ptr_;
    uint64_t* uint64_ptr_;
    charp* charp_ptr_;
    FlagHandler flag_handler_;
    OptionHandler option_handler_;
}

根据 union 的特性，针对不同的 Flag Type，会得到不同值类型，可见之前定义的 FLAG_timeline_streams 值最终就会设置成透传的值。例如 —trace_startup 对应的值为 Compiler,Dart,Debugger,Embedder,GC,Isolate,VM。

设置 Flag 的过程就是具体设置了之前定义的 FLAG_timeline_streams 值。

TimelineStream 初始化

在 FLAG_timeline_streams 中非常多的类型值，每种都定义了不同的 Stream，初始化过程包括三个步骤：Declare Stream(申明)、Get Stream(获取)、Define Stream(定义)。

✎ Declare Stream

/path/to/engine/src/third_party/dart/runtime/vm/timeline.h

// stream 申明
#define TIMELINE_STREAM_DECLARE(name, fuchsia_name)                            \
  static TimelineStream stream_##name##_;
  TIMELINE_STREAM_LIST(TIMELINE_STREAM_DECLARE)
#undef TIMELINE_STREAM_DECLARE

// 展开后
static TimelineStream stream_API_;
static TimelineStream stream_Compiler_;
static TimelineStream stream_Dart_;
static TimelineStream stream_Embedder_;
....

Flutter Engine 中的 Timeline 信息为 stream_Embedder_，其它的 Timeline 也包括 Dart 层、API 层等等，本文主要会关注在 stream_Embedder_。

✎ Get Stream

/path/to/engine/src/third_party/dart/runtime/vm/timeline.h

// 获取 Stream
#define TIMELINE_STREAM_ACCESSOR(name, fuchsia_name)                           \
  static TimelineStream* Get##name##Stream() { return &stream_##name##_; }
  TIMELINE_STREAM_LIST(TIMELINE_STREAM_ACCESSOR)
#undef TIMELINE_STREAM_ACCESSOR

// 展开后
static TimelineStream* GetAPIStream() { return &stream_API_; }
static TimelineStream* GetDartStream() { return &stream_Dart_; }
static TimelineStream* GetEmbedderStream() { return &stream_Embedder_; }
...

设置了相应的静态获取方法。

Define Stream

/path/to/engine/src/third_party/dart/runtime/vm/timeline.cc

#define TIMELINE_STREAM_DEFINE(name, fuchsia_name)                             \
  TimelineStream Timeline::stream_##name##_(#name, fuchsia_name, false);
TIMELINE_STREAM_LIST(TIMELINE_STREAM_DEFINE)
#undef TIMELINE_STREAM_DEFINE

// 展开后
TimelineStream Timeline::stream_API_("API", "dart:api", false);
TimelineStream Timeline::stream_Dart_("Dart", "dart:dart", false);
TimelineStream Timeline::stream_Embedder_("Embedder", "dart:embedder", false);
...

Timeline 初始化

void Timeline::Init() {
  ASSERT(recorder_ == NULL);
  recorder_ = CreateTimelineRecorder();
  ASSERT(recorder_ != NULL);
  enabled_streams_ = GetEnabledByDefaultTimelineStreams();
// Global overrides.
#define TIMELINE_STREAM_FLAG_DEFAULT(name, fuchsia_name)                       \
  stream_##name##_.set_enabled(HasStream(enabled_streams_, #name));
  TIMELINE_STREAM_LIST(TIMELINE_STREAM_FLAG_DEFAULT)
#undef TIMELINE_STREAM_FLAG_DEFAULT
}

1、通过 CreateTimelineRecorder 创建 TimelineEventRecorder，如果需要获取启动 Tracing 信息会创建 TimelineEventEndlessRecorder，会记录无上限的 Trace 信息。
2、设置刚才创建的一系列 TimelineStream 实例的 set_enable 函数，后续在进行 Timeline 记录的时候都会查询是否 enable。

▐ 记录 Timeline 信息

上一部分主要讲了 Timeline 初始化准备的各种信息变量，这部分主要会讲记录 Tracing 信息的过程。

记录 Tracing 信息有非常多的调用方法，包括记录同步事件（TRACE_EVENT）、异步事件（TRACE_EVENT_ASYNC）、事件流(TRACE_FLOW_)。以下讲同步事件的调用过程，其他事件整个流程基本类似。

同步事件包括 TRACE_EVENT0 、TRACE_EVENT1、TRACE_EVENT2 等，以 TRACE_EVENT0 调用为例：

{
    TRACE_EVENT0("flutter", "Shell::CreateWithSnapshots");
}

// 展开后
::fml::tracing::TraceEvent0("flutter", "Shell::CreateWithSnapshots");
::fml::tracing::ScopedInstantEnd __trace_end___LINE__("Shell::CreateWithSnapshots");

主要包括两个部分：

记录阶段 TraceEvent0，记录当前信息
标记结束 ScopedInstantEnd ，一般在作用域析构时调用

TraceEvent0

TraceEvent0 最终会调用如下方法：

path/to/engine/src/third_party/dart/runtime/vm/dart_api_impl.cc

DART_EXPORT void Dart_TimelineEvent(const char* label,
                                    int64_t timestamp0,
                                    int64_t timestamp1_or_async_id,
                                    Dart_Timeline_Event_Type type,
                                    intptr_t argument_count,
                                    const char** argument_names,
                                    const char** argument_values) {
...
TimelineStream* stream = Timeline::GetEmbedderStream();
  ASSERT(stream != NULL);
  TimelineEvent* event = stream->StartEvent();
...
switch (type) {
    case Dart_Timeline_Event_Begin:
      event->Begin(label, timestamp0);
      break;
    case Dart_Timeline_Event_End:
      event->End(label, timestamp0);
      break;
...
  }
...
event->Complete();
}

整个过程主要包括四个阶段：

TimelineStream::StartEvent：生成 TimelineEvent，其中Timeline::GetEmbedderStream() 即为初始化阶段的 stream_Embedder_。
TimelineEvent::Begin/End：记录起始、结束的时间等信息
TimelineEvent::Complete：完成当前记录
TimelineEventBlock::Finish：上报记录的信息

✎ TimelineStream::StartEvent

stream->StartEvent() 最终会调用如下方法产生 TimelineEvent：

/path/to/engine/src/third_party/dart/runtime/vm/timeline.cc

TimelineEvent* TimelineEventRecorder::ThreadBlockStartEvent() {
  // Grab the current thread.
  OSThread* thread = OSThread::Current();
  ASSERT(thread != NULL);
  Mutex* thread_block_lock = thread->timeline_block_lock();
...
  thread_block_lock->Lock(); // 会一直持有，直到调用 CompleteEvent()
...
  TimelineEventBlock* thread_block = thread->timeline_block();

  if ((thread_block != NULL) && thread_block->IsFull()) {
    MutexLocker ml(&lock_);
    // Thread has a block and it is full:
    // 1) Mark it as finished.
    thread_block->Finish();
    // 2) Allocate a new block.
    thread_block = GetNewBlockLocked();
    thread->set_timeline_block(thread_block);
  } else if (thread_block == NULL) {
    MutexLocker ml(&lock_);
    // Thread has no block. Attempt to allocate one.
    thread_block = GetNewBlockLocked();
    thread->set_timeline_block(thread_block);
  }
  if (thread_block != NULL) {
    // NOTE: We are exiting this function with the thread's block lock held.
    ASSERT(!thread_block->IsFull());
    TimelineEvent* event = thread_block->StartEvent();
    return event;
  }
....
  thread_block_lock->Unlock();
  return NULL;
}

1、首先会调用线程锁，一直持有本次记录过程，直到调用 CompleteEvent()。
2、如果没有 TimelineEventBlock ，则首先会创建一个，并记录在当前线程中。
3、如果 TimelineEventBlock 满了，会先 Finish （见下文分析），再创建一个新的，并记录。
4、最后都会在 TimelineEventBlock 中创建一个新的 TimelineEvent，每个 TimelineEventBlock 创建的 TimelineEvent 会有数量限制，最多为 64 个。

⚠️：如果为 TimelineEventEndlessRecorder，则会无限创建 TimelineEventBlock，否则会有数量限制。

✎ TimelineEvent::Begin/End

/path/to/engine/src/third_party/dart/runtime/vm/timeline.cc

void TimelineEvent::Begin(const char* label,
                          int64_t micros,
                          int64_t thread_micros) {
  Init(kBegin, label);
  set_timestamp0(micros);
  set_thread_timestamp0(thread_micros);
}

这些阶段主要是记录具体的信息，包括：
1、Init: 记录事件标签名，事情类型（kBegin，kEnd），End 一般会在作用域析构时调用（下面会分析）。
2、micros: 记录系统启动后运行的时间戳。

3、thread_micros: 记录该线程CPU运行的时间戳。

✎ TimelineEvent::Complete

最终调用方法如下：

/path/to/engine/src/third_party/dart/runtime/vm/timeline.cc

void TimelineEventRecorder::ThreadBlockCompleteEvent(TimelineEvent* event) {
...
   // Grab the current thread.
  OSThread* thread = OSThread::Current();
  ASSERT(thread != NULL);
  // Unlock the thread's block lock.
  Mutex* thread_block_lock = thread->timeline_block_lock();
...
  thread_block_lock->Unlock();
}

一次记录结束后会调用 Complete 方法，并最终会释放一开始 Lock 的同步锁。

✎ TimelineEventBlock::Finish

在 TimelineStream::StartEvent 中创建的TimelineEventBlock 提到，默认最多是 64 个，满了之后会调用 Finsih 方法。

void TimelineEventBlock::Finish() {
...
  in_use_ = false;
#ifndef PRODUCT
  if (Service::timeline_stream.enabled()) {
    ServiceEvent service_event(NULL, ServiceEvent::kTimelineEvents);
    service_event.set_timeline_event_block(this);
    Service::HandleEvent(&service_event);
  }
#endif
}

最终会将事件信息发送给 ServiceIsolate 来处理，关于 ServiceIsolate 简单可以理解为后端服务，是由 Dart VM 初始化的时候创建的， DevTool 显示的信息（包括 Tracing 信息）都会和 ServiceIsolate 通信获取。

ScopedInstantEnd

class ScopedInstantEnd {
 public:
  ScopedInstantEnd(const char* str) : label_(str) {}
  ~ScopedInstantEnd() { TraceEventEnd(label_); }
 private:
  const char* label_;
  FML_DISALLOW_COPY_AND_ASSIGN(ScopedInstantEnd);
};

可以看到析构函数中会调用 TraceEventEnd 方法，也就是说离开了作用域就会调用 TraceEventEnd 方法，而 TraceEventEnd 方法最终调用的就是 TimelineEvent::End 阶段进行信息记录。

以上就是整体的 Tracing 信息的路由过程，实现上使用了大量的宏，宏在开发阶段还是方便实现，不过对于阅读源码来说会有一定的障碍，不能直观的进行代码搜索查找。

实践篇

主要介绍 Timeline 的使用、启动性能分析、有用的 Debug 参数介绍、以及添加自定义 Tracing 节点。

▐ Timeline 使用

Timeline 的使用在官方文档中已经有详细的说明，Using the Timeline view - Flutter 直接看文档即可。

▐ 启动性能分析

Timeline 工具仅仅只能分析 Flutter 页面启动之后的运行时情况，整个 Flutter 的启动过程完全是无法分析的，而启动/初始化过程也是比较关键的一环。

对于启动性能分析，官方文档描述甚少，目前只发现了这一处，Measuring app startup time - Flutter。

启动性能分析包括三个步骤：添加启动性能参数、获取 Tracing 信息、分析。

添加启动参数

只有添加了特定的参数后才能获取启动时 Tracing 信息。

✎ Flutter App 场景

flutter run --trace-startup --profile

主要是通过 flutter cli 命令行参数运行 Flutter App，最终会在当前目录下生成 build/start_up_info.json 文件。

可惜的是这个文件只产出了四个关键的 Timestamp，远远达不到能够分析的地步，跟进 Flutter Tools 源码后，关键源码如下：

path/to/flutter/packages/flutter_tools/lib/src/tracing.dart

/// Download the startup trace information from the given observatory client and
/// store it to build/start_up_info.json.
Future<void> downloadStartupTrace(VMService observatory, { bool awaitFirstFrame = true }) async {
    final Tracing tracing = Tracing(observatory);

  final Map<String, dynamic> timeline = await tracing.stopTracingAndDownloadTimeline(
    awaitFirstFrame: awaitFirstFrame,
  );
......
 final Map<String, dynamic> traceInfo = <String, dynamic>{
    'engineEnterTimestampMicros': engineEnterTimestampMicros,
  };
......
    traceInfo['timeToFrameworkInitMicros'] = timeToFrameworkInitMicros;
......
    traceInfo['timeToFirstFrameRasterizedMicros'] = firstFrameRasterizedTimestampMicros - engineEnterTimestampMicros;
......
    traceInfo['timeToFirstFrameMicros'] = timeToFirstFrameMicros;
......
  traceInfo['timeAfterFrameworkInitMicros'] = firstFrameBuiltTimestampMicros - frameworkInitTimestampMicros;
......
traceInfoFile.writeAsStringSync(toPrettyJson(traceInfo));
}

可以看到关键的四个 Timestamp 被保存在 Map 进行输出到文件，最关键的一点是整个 timeline 数据其实都已经拿到了，于是可以进行如下改造：

/// Download the startup trace information from the given observatory client and
/// store it to build/start_up_info.json.
Future<void> downloadStartupTrace(VMService observatory, { bool awaitFirstFrame = true }) async {
    final Tracing tracing = Tracing(observatory);

  final Map<String, dynamic> timeline = await tracing.stopTracingAndDownloadTimeline(
    awaitFirstFrame: awaitFirstFrame,
  );
......
// 原来的 start_up_info.json 生成
    traceInfoFile.writeAsStringSync(toPrettyJson(traceInfo));
......
// 新增 start_up_trace_events.json 生成
    final String traceEventsFilePath = globals.fs.path.join(getBuildDirectory(), 'start_up_trace_events.json');
  final File traceEventsFile = globals.fs.file(traceEventsFilePath);
  final List<Map<String, dynamic>> events =
        List<Map<String, dynamic>>.from((timeline['traceEvents'] as List<dynamic>).cast<Map<String, dynamic>>());
  traceEventsFile.writeAsStringSync(toPrettyJson(events));
}

改造后会在当前目录下生成 build/start_up_trace_events.json 文件，并通过 chrome://tracing 打开查看。有一个注意点，在改动 flutter tools 代码后，需要重新生成 flutter command ，具体可以看文档。The flutter tool · flutter/flutter Wiki · GitHub

上面这个场景对于整个 Flutter App 来讲是完全可以进行启动性能分析了，但是对于 Add to App 的场景还是无法满足，因为这种场景无法通过 flutter cli 来进行参数透传。

**✎ Add To App 场景
**
对于这种场景，需要通过 Platform 层去透传参数。

Android

Android 侧参数透传方法如下：

path/to/engine/src/flutter/shell/platform/android/io/flutter/embedding/engine/FlutterEngine.java

public FlutterEngine(
      @NonNull Context context,
      @NonNull FlutterLoader flutterLoader,
      @NonNull FlutterJNI flutterJNI,
      @NonNull PlatformViewsController platformViewsController,
      @Nullable String[] dartVmArgs,
      boolean automaticallyRegisterPlugins) {
......
}

通过实例化 FlutterEngine 时的构造参数 dartVmArgs 中添加 --trace-startup 即可。

new FlutterEngine(mPlatform.getApplication().getApplicationContext(),
                    FlutterLoader.getInstance(),new FlutterJNI(),new String[]{"--trace-startup"},true);

iOS

iOS 侧通过源码查看，对应的 FlutterEngine.mm 的构造参数中是没有对应的 dartVmArgs 参数透传。真正参数转换的地方如下：

path/to/engine/src/flutter/shell/platform/darwin/common/command_line.mm

fml::CommandLine CommandLineFromNSProcessInfo() {
  std::vector<std::string> args_vector;
  for (NSString* arg in [NSProcessInfo processInfo].arguments) {
    args_vector.emplace_back(arg.UTF8String);
  }
  return fml::CommandLineFromIterators(args_vector.begin(), args_vector.end());
}

通过 [NSProcessInfo processInfo].arguments 拿的命令行参数，无法通过自定义加入参数实现，对于从 XCode 启动 App 的可以通过编辑 schema 添加参数实现，示例如下：

但是绝大多数情况下，不会通过 XCode 来启动 App，因此还是需要通过修改 Engine 代码来实现参数传递。对此提了 PR 来支持 dartVm 参数的透传。

path/to/engine/src/flutter/shell/platform/darwin/ios/framework/Source/FlutterDartProject.mm

- (instancetype)initWithDartVmArgs:(nullable NSArray<NSString*>*)args {
  return [self initWithPrecompiledDartBundle:nil dartVmArgs:args];
}

初始化 FlutterEngine.mm 中可以通过如下方式初始化：

_dartProject = [[FlutterDartProject alloc] initWithPrecompiledDartBundle:dartBundle dartVmArgs:@[@"--trace-startup"]];
_engine = [[FlutterEngine alloc] initWithName:@"io.flutter" project:_dartProject allowHeadlessExecution:YES];

Android Systrace

对于 Android 设备来讲，还可以用 Android 独有的 Systrace 来看，不需要改任何 Flutter 相关的参数。

获取 Tracing 文件

添加了启动参数之后，需要有工具进行查看，Flutter 默认提供的 DevTool 默认就能进行查看，按如下步骤：

拿到启动后的 Observatory 地址。
通过 flutter attach --debug-uri=observatory_url attach 到对应的服务，会生成一个 debugger/profiler 地址。
打开 debugger/profiler 地址后就是 Fluuter 默认的 DevTool 工具，点击 timeline 按钮即可打开 Tracing 内容。

分析 Tracing 文件

关于 Tracing 工具的使用可以查看相关 Chrome 文档， The Trace Event Profiling Tool (about:tracing)。

展示的信息比较直观，对于启动性能分析，能非常直观的看到各个部分的耗时情况，下图是 Flutter 启动时 iOS 上的各个耗时阶段的大致分布，图的左边，可以看到各个阶段执行对应的线程。

▐ Debug 参数

上面介绍了如何获取 Tracing 的方法，生成的 Tracing 耗时分布主要包括各个阶段的耗时，但是还并不是包含所有的阶段，介绍两个有用的 Debug 参数，其他相关参数参考文档 [Debug flags: performance - Flutter
](链接地址https://flutter.dev/docs/testing/code-debugging?spm=ata.13261165.0.0.32ca24d41mrBFF#debug-flags-performance)
debugProfilePaintsEnabled

path/to/flutter/packages/flutter/lib/src/rendering/debug.dart

bool debugProfilePaintsEnabled = false;

这个参数会在渲染 Paint 阶段，显示所有 Paint 时节点的遍历情况，可以根据这些信息查看是否有无用的节点 Paint

debugProfileBuildsEnabled

path/to/flutter/packages/flutter/lib/src/widgets/debug.dart

bool debugProfileBuildsEnabled = false;

这个参数会在 Widget Build 阶段，显示所有 Widget 节点 Build 时的遍历情况，可以根据这些信息查看是否有无用的节点 Build。

上图把 build、paint 阶段的过程全都显示出来了，有了这些信息后，还需要结合自身的业务逻辑分析 Widget Build/Paint 是否合理，是否执行了无用的操作，然后进行优化。

自定义 Tracing 节点

对于默认没有打点的地方，如果自己需要查看其耗时，则可以自行进行打点。例如需要查看创建 IOSContext 的耗时，则可以进行如下打点：

std::unique_ptr<IOSContext> IOSContext::Create(IOSRenderingAPI rendering_api) {
  TRACE_EVENT0("flutter", "IOSContext::Create");
  ......
  FML_CHECK(false);
  return nullptr;
}

最终会反应在 Tracing 上，如下图：

后记

本文主要分析了 Tracing 在 Flutter 上的实现以及一些实践，Tracing 是 Chrome 实现的一种标准格式，任何技术栈的性能分析都可以生成这种标准格式，然后利用现成的 Chrome DevTool 工具打开即可分析，非常直观，能启到事半功倍的效果。

关注「淘系技术」微信公众号，一个有温度有内容的技术社区~

Flutter 性能优化的利器 —— Tracing

背景

原理篇

实践篇

后记

大淘宝技术

热门文章

最新文章

相关课程

相关电子书

相关实验场景

热门

活动广场

任务中心

开发者评测

高校计划

乘风者计划

训练营

阿里云MVP

话题

直播

下载

镜像站

技术资料

插件

Flutter 性能优化的利器 —— Tracing

背景

原理篇

实践篇

后记

大淘宝技术

热门文章

最新文章

相关课程

相关电子书

相关实验场景