diff --git a/esp/src/src-react/components/ECLPlayground.tsx b/esp/src/src-react/components/ECLPlayground.tsx
index 14ff6d1de1b..7a15a9f27fc 100644
--- a/esp/src/src-react/components/ECLPlayground.tsx
+++ b/esp/src/src-react/components/ECLPlayground.tsx
@@ -20,6 +20,7 @@ const logger = scopedLogger("../components/ECLPlayground.tsx");
 
 interface ECLPlaygroundProps {
     wuid?: string;
+    ecl?: string;
 }
 
 const enum OutputMode {
@@ -339,7 +340,7 @@ const ECLEditorToolbar: React.FunctionComponent<ECLEditorToolbarProps> = ({
 
 export const ECLPlayground: React.FunctionComponent<ECLPlaygroundProps> = (props) => {
 
-    const { wuid } = props;
+    const { wuid, ecl } = props;
     const theme = useTheme();
 
     const [outputMode, setOutputMode] = React.useState<OutputMode>(OutputMode.ERRORS);
@@ -363,13 +364,17 @@ export const ECLPlayground: React.FunctionComponent<ECLPlaygroundProps> = (props
                     setOutputMode(OutputMode.RESULTS);
                 }
             });
+        } else if (ecl) {
+            setEclContent(ecl);
         }
 
         fetch("/esp/files/eclwatch/ecl/ECLPlaygroundSamples.json")
             .then(response => response.json())
             .then(json => setEclSamples(
                 json.items.map(item => {
-                    if (item.selected && !wuid) setSelectedEclSample(item.filename);
+                    if (item.selected && !wuid && !ecl) {
+                        setSelectedEclSample(item.filename);
+                    }
                     return { key: item.filename, text: item.name };
                 })
             ));
@@ -381,7 +386,7 @@ export const ECLPlayground: React.FunctionComponent<ECLPlaygroundProps> = (props
                 editor.option("theme", "default");
             }
         }
-    }, [wuid, editor, theme]);
+    }, [wuid, editor, theme, ecl]);
 
     React.useEffect(() => {
         fetch(`/esp/files/eclwatch/ecl/${selectedEclSample}`)
diff --git a/esp/src/src-react/components/Files.tsx b/esp/src/src-react/components/Files.tsx
index 70fb194cfb0..01a1e53eca8 100644
--- a/esp/src/src-react/components/Files.tsx
+++ b/esp/src/src-react/components/Files.tsx
@@ -201,6 +201,12 @@ export const Files: React.FunctionComponent<FilesProps> = ({
                     return Utility.convertedSize(row.IntSize);
                 },
             },
+            CompressedFileSizeString: {
+                label: nlsHPCC.CompressedSize,
+                formatter: (value, row) => {
+                    return Utility.convertedSize(row.CompressedFileSize);
+                }
+            },
             Parts: {
                 label: nlsHPCC.Parts, width: 40,
             },
diff --git a/esp/src/src-react/routes.tsx b/esp/src/src-react/routes.tsx
index d5e36af6746..0f3e0469a03 100644
--- a/esp/src/src-react/routes.tsx
+++ b/esp/src/src-react/routes.tsx
@@ -87,8 +87,8 @@ export const routes: RoutesEx = [
         path: ["/play", "/playground"],
         children: [
             {
-                path: "", action: () => import("./components/ECLPlayground").then(_ => {
-                    return <_.ECLPlayground />;
+                path: "", action: (ctx, params) => import("./components/ECLPlayground").then(_ => {
+                    return <_.ECLPlayground ecl={parseSearch(ctx.search)?.ecl as string} />;
                 })
             },
             {