itables (datatables.net) in marimo

[liquidcarbon]

I've long been a fan of jQuery-based DataTables.net and their pythonic wrapper itables.

They're extremely powerful and flexible and are significantly more performant compared to the tables offered in marimo.

I was not able to get them to render them inside Marimo directly, but you they can work in an iframe.

The iframe can also be pointed at another FastAPI endpoint serving such table in a mounted app scenario.
Was not able to make it work via iframe srcdoc.

mo.Html("""
<iframe src="https://liquidcarbon-duckdb-fastapi-gradio.hf.space/q?query_id=01HWDNFA8QTEA1Y1V229501RMF"
style="width: 900px; min-height: 540px;">
</iframe>
""")

Just going to leave this here in case others have feelings about these tables.

[akshayka]

@liquidcarbon In what way are they more performant? Or rather, in what areas could the performance of marimo's native tables be improved?

[liquidcarbon]

If you try to display a dataframe with 10K rows, DataTables handles it easily (purely client side, can do 100K+ with SSR; YMMV depending on number of cols);
Marimo would take a while to respond.

[mwouts]

Thank you @liquidcarbon for pointing out at Marimo and for your kind words on ITables!

I see that the ITable widget from ITables v2.2.4 works in Marimo to some extend - give a try to the below:

import pandas as pd

from itables.widget import ITable

df = pd.read_json(
    "https://raw.githubusercontent.com/vega/vega-datasets/master/data/cars.json"
)

ITable(df)

I have not tested it thoroughly yet but I suspect already that some additional work will be required to have the widget work properly in Marimo. In a quick test I have seen the following problems:

• the table widget is not updated when I modify the underlying dataframe
• the selected rows are not highlighted.

Maybe the Marimo developers will have some documentation I can look at re how to best integrate a widget in this ecosystem?

[mscolnick]

@mwouts awesome to see it mostly works

the table widget is not updated when I modify the underlying dataframe

not sure about this issue. let me know if you need help debugging.

the selected rows are not highlighted.

we place widgets in a ShadowDOM so may change the structure you expect when writing your CSS selectors