A lot of my custom apps have been hanging on their loading screens for several minutes. Am I simply loading too much data (about 55 fields) from too many records (about 11,500 in the table I’m selecting with getTableByName) ? Am I using the useRecords hook wrong? I made a test app with just the Hello World template and loaded in my records, so I’m fairly sure the issue isn’t anything else I wrote… Any suggestions would be very appreciated!
Here is the way I am loading data into the Hello World app:
import {
initializeBlock,
useBase,
useRecords,
} from "@airtable/blocks/ui";
import React from 'react';
function HelloWorldApp() {
const base = useBase();
const lineItems= base.getTableByNameIfExists("Items");
const view1 = lineItems.getViewByName("View 1");
const opts = {
sorts: [
{ field: "On hold" },
{ field: "Locked" },
{ field: "Priority", direction: "desc" },
{ field: "Was on hold previously", direction: "desc" },
{ field: "Countdown start" },
{ field: "Order ID" },
],
fields: [
"Order ID",
....
.... (about 50 other fields)
....
],
};
const view1Records = useRecords(view1, opts);
const view2 = lineItems.getViewByName("View 2");
const view2Records = useRecords(view2, opts);
const view3 = lineItems.getViewByName("View 3");
const view3Records = useRecords(view3, opts);
return <div>Hello world 🚀</div>;
}
initializeBlock(() => <HelloWorldApp />);
