Add setup docs for Fresco/Images

Summary: Per title.

Reviewed By: danielbuechele

Differential Revision: D15898614

fbshipit-source-id: b2d86a58e80b1309159bc738bcc66ca09cd796ad

docs/features/images-plugin.md

@@ -3,6 +3,8 @@ id: images-plugin
 title: Images
 ---
 
+→ [See setup instructions for the images plugin](setup/images-plugin.md)
+
 The images plugin allows you to inspect what images were fetched, where they are
 coming from and selectively clear caches. Currently, the plugin supports
 [Fresco](https://github.com/facebook/fresco/) as backend.

docs/setup/images-plugin.md

@@ -0,0 +1,64 @@
+---
+id: images-plugin
+title: Images Setup
+sidebar_label: Images
+---
+
+Currently, the images plugin only supports [Fresco](https://frescolib.org/) for Android as backend, but just like the network plugin, support for other image loading libraries
+could easily be added. Send us a PR!
+
+## Fresco and Android
+
+```java
+import com.facebook.flipper.plugins.fresco.FrescoFlipperPlugin;
+
+client.addPlugin(new FrescoFlipperPlugin());
+```
+
+The `FrescoFlipperPlugin` constructor offers a whole lot of configuration options which
+can be useful if you have an advanced setup of Fresco in your application:
+
+
+```java
+FrescoFlipperPlugin(
+      DebugImageTracker imageTracker,
+      PlatformBitmapFactory bitmapFactory,
+      @Nullable FlipperObjectHelper flipperObjectHelper,
+      DebugMemoryManager memoryManager,
+      FlipperPerfLogger perfLogger,
+      @Nullable FrescoFlipperDebugPrefHelper debugPrefHelper,
+      @Nullable CloseableReferenceLeakTracker closeableReferenceLeakTracker) { ... }
+```
+
+### Leak Tracking
+
+The Flipper plugin can help you track down `CloseableReferences` who have not had
+`close()` called on them. This can have a negative impact on the performance of
+your application.
+
+Do enable this functionality, you need to create a `CloseableReferenceLeakTracker`
+and set it in both your `ImagePipelineConfig` for Fresco and the `FrescoPluginPlugin`
+on creation.
+
+```java
+import com.facebook.imagepipeline.debug.FlipperCloseableReferenceLeakTracker;
+
+// ...
+
+FlipperCloseableReferenceLeakTracker leakTracker = new FlipperCloseableReferenceLeakTracker();
+
+new ImagePipelineConfig.Builder()
+    // ...
+    .setCloseableReferenceLeakTracker(leakTracker)
+    .build();
+
+
+client.addPlugin(new FrescoFlipperPlugin(
+    new FlipperImageTracker(),
+    Fresco.getImagePipelineFactory().getPlatformBitmapFactory(),
+    null,
+    new NoOpDebugMemoryManager(),
+    new NoOpFlipperPerfLogger(),
+    null,
+    leakTracker));
+```

website/i18n/en.json

@@ -104,6 +104,10 @@
         "title": "Databases Plugin Setup",
         "sidebar_label": "Databases"
       },
+      "setup/images-plugin": {
+        "title": "Images Setup",
+        "sidebar_label": "Images"
+      },
       "setup/layout-plugin": {
         "title": "Layout Inspector Setup",
         "sidebar_label": "Layout Inspector"

website/sidebars.json

@@ -23,6 +23,7 @@
       "setup/layout-plugin",
       "setup/network-plugin",
       "setup/databases-plugin",
+      "setup/images-plugin",
       "setup/sandbox-plugin",
       "setup/shared-preferences-plugin",
       "setup/leak-canary-plugin",