Hi everyone. I thought it might be useful to start a thread for speed-related tips. What we have found through knowledge or experience that helped our apps run faster and smoother…
I have a question regarding images. Do images load faster from certain components? Someone had previously mentioned that they noticed the images in Title components load instantly.
What should we be mindful of when using images in our apps?
Images loading faster in the title component used to be a thing in classic apps, but I’m not sure that’s still the case.
Jeff, Darren and Thinh have written quite a bit about app performance in the forum over the years. You’ll usually find Jeff’s explanations in topics with the keyword “performance”.
I have a tendency to forget the intricacies of what makes an app more performant. A few months ago I wrote up the following, it’s fairly basic and common sense. Unfortunately I don’t go into detail, details that might actually make a difference, precisely because I cannot retain them.
Regardless, the following might be a decent addition to this topic. Thanks for starting it, great idea, app performance is a recurring topic in the forum.
thanks @nathanaelb. Good to know.
What is a Single Self Relation? Is it where you’re relating data from 2 columns within the same table?
A self relation is a relation that relates a column to itself. Now that I think of it, I’m not sure if it makes a difference if the self relation is “match multiple” or not (what I called “single”).
The self relation used to be used quite a bit, basically you can create a unique list within a table where you otherwise would have duplicates. It was useful to create reports for instance. Now I would use the query column.
oohh, i see
My guess is that it cannot hurt to try to optimize images like Wix recommends.
I believe Glide also optimizes images under the hood.
I’ve never done it, but the following experiment could be interesting: upload a non-optimized image, navigate to the web app and then inspect the image on the page or download it. I would not be surprised if the image type, resolution and size were all optimized.
Yes the delivery of images in Glide is optimized using cloudinary. But you can compress images before upload, to further enhance optimization (image size reduction at display)
I use this trick to preload images in my apps.
On a one row table add a joined list and target an image column
Next add a java script column and use the joined list for the p1 parameter
Finally put a rich text component on screen and use the java script as it’s source
Try it here: Custom Carousel with Preloaded Images and Enlarge Image
Java Script
if (p1) {
function generateHtmlFromCsv(csvString) {
const imageUrls = csvString.split(',');
// Start building the HTML string
let html = `<!DOCTYPE html>
<html>
<head>
<title>Inline CSS Example</title>
</head>
<body>
<div style="display: none; flex-wrap: wrap;">`;
// Create a div with specified style for each image URL
imageUrls.forEach((url, index) => {
html += `
<div style="flex: 20%; padding: 5px;">
<img src="${url.trim()}" alt="Image ${index + 1}" style="width: 100%; height: auto;">
</div>`;
});
// Close the HTML string
html += `
</div>
</body>
</html>`;
return html;
}
// Assuming p1 contains the CSV string of image URLs
const csvString = p1;
// Call the function and return the result
return generateHtmlFromCsv(csvString);
}
Reduce the use of Query for a whole table. instead build a relation and from that use a query.
I see in the linked thread you mentioned to avoid duplicating collections and then using visibility conditions and filters on those.
Is processing a single table in different ways the cause of the slow down?
Also, does invisible data still have “weight” on a page?
5 Ways to Make Your Glide Apps Fly Like a Jet!
TIPS FOR ENHANCING SPEED AND PERFORMANCE IN GLIDE APPS
Improving the speed of your Glide apps is crucial, especially as they grow and handle larger datasets. Here are five effective tips for boosting the performance of your Glide apps:
Minimize the Use of Queries:
Avoid using Queries as much as possible and opt for Relations instead. Queries require more processing time and can slow down the app, while Relations can provide the same result more efficiently.
Separate Apps for Different User Types:
Creating separate apps for each user type allows you to use Row Owners, which reduces the amount of data loaded onto the user’s device, enhancing the loading speed of pages and components.
Compress Images Before Uploading:
Large images can significantly slow down the app’s loading time. Use image compression tools before uploading to ensure faster page loads for image-heavy content.
Use Glide Tables:
Prefer Glide Tables over external data sources like Google Sheets or Airtable. Glide Tables load faster and reduce the user’s waiting time.
Remove Irrelevant Components and Pages:
Removing components and pages that are not relevant to each user allows for a smoother and faster user experience. Fewer data and components loaded onto the device result in better speed and performance.
These principles, among others, can significantly enhance the user experience of your Glide apps, ensuring fast and efficient performance.
Hello @Gideon_Lahav_Busines
Wanted to know your opinion regarding performance and location of data centers in this thread:
Hi Jarvis,
this is for the Glide dev team to answer, not me.