Square Online: Removing images from API call on paginated products view

Preface

Apologies if this is not the right location to ask this question.

I’ve been unable to find technical support for Square Online pages, specifically for reporting bugs, asking for backend improvements, etc.

If there is a better location than this forum please feel free to point me there.

The Problem

I’m trying to help a client debug intermittent slowdowns their customers are experiencing on their Square Online page when viewing the paginated product page grid, such as all products in a specific category.

They have several hundred items, organized into many categories, and each with many modifiers and options. When exported to an excel spreadsheet, their Square Items library contains 18,500 unique Item Tokens. Many items have 6 or more product images.

An XHR request to the products API is fired off on pages with the paginated products grid view and will frequently (but not consistently) take 20-50 seconds to resolve. It seems that when the response is not cached, the complexity of the items library may be causing the server to really struggle generating the reply.

I want to emphasize that this is not a connection or client-side issue. I’ve verified this on several different machines and network locations with very solid connections.

The API call for viewing the paginated view of products in a given category generally looks like this:

https://cdn5.editmysite.com
    /app/store
    /api/v17/editor
    /users/{USERID}
    /sites/{SITEID}
    /products
    ? page = 1 
    & per_page = 60 
    & sort_by = category_order
    & sort_order = asc
    & categories[] = {CATEGORYID}
    & include = images, media_files
    & excluded_fulfillment = dine_in

I noticed that if I remove the ‘images’ include in the query string, the resulting reply is about 20% of the original size. For example in a specific case I’ve logged (see more at bottom of post), for the product page of a category with 9 items the response decreased from 155,292 characters to 31,742 characters when removing the images from the query string include.

As best as I can tell the images data is completely unused in the paginated grid view - the images displayed there use the ‘thumbnails’ object which is included even when images is not specified in the query string.

While it is definitely possible that the huge slowdown when the server’s API response is not cached is due to hitting some edge case due to the complexity of the Items Library of this store, I’d like to at least try to see if having the API response be less verbose would have a noticeable impact on its overall response time.

Cutting down the response data by a factor of 5 seems like it would be worth a shot.

The Question

Is there any way that the default Square Online products grid view could be modified to not request images, or potentially use a less verbose response format? Is a Square user relying on the default Square Online templates just SOL?

Alternatively, are there any recommendations for how to debug these kinds of API slowdowns? Is there any Square technical support I could reach out to help identify what is actually causing the API to respond so abysmally slow for this specific store and Item Library?

Best,
Johannes

PS: Below I’ve included a full log showing the aforementioned slowdown

Example Log

I captured the following network log as I clicked on a category that contains 9 items total, which I exported using the ‘Export HAR file…’ option in the Google Developer tools Network tab: https://gist.githubusercontent.com/JohannesMP/8dca677b9307dd20c6dbb7437b0282bf/raw/858f30ea3dcdf79c89d5eab3f3aa4733131d7a9a/shop.mythimorph.com.har

To view for reference you can download the file as plaintext with a .har extension and the ‘Import HAR file…’ option in the Chrome Developer tools Networks tab.

The API call to retrieve the product information for the 9 items for the page’s grid view took 23.28 seconds to complete, was 12.2kB in size and 155293 characters.

Here is the raw JSON response, formatted for readability: https://gist.githubusercontent.com/JohannesMP/8dca677b9307dd20c6dbb7437b0282bf/raw/9cd43cd626bd7195978c70dc0ec732dec315fef4/result.json

:wave: Have you shared this with the Square Online Success team? That would be the place where technical issue such as this with the Online Store should be submitted. :slightly_smiling_face:

1 Like

Hi Bryan, thanks for the quick reply!

I was unaware of the Square Online Success team and am unsure how I should best reach out to them.

Could you point me in the right direction?

If you reach out to Square Customer Success then they can get you to a Square Online Store advocate to escalate the issue. :slightly_smiling_face:

Thanks Bryan.

I reached out to chat support and they mentioned that they would forward this to the Square Online team:

This was right at the end of support business hours so I will be waiting until tomorrow to see if anything further might come of it.



@Bryan-Square I was hoping you might be able to answer a semi-related follow-up question:

The storefront is managed through weebly.com which seems to sync the items from Squareup’s Item Library: https://i.imgur.com/uFpvf82.png (imgur image link since as a new developer forums user I am not allowed to embed more than one image in a post…)


I'm therefore not positive, is the API request that I discuss in my post querying SquareUp's data or Weebly's? It's not immediately obvious to me where the request to
https://cdn5.editmysite.com/app/store/api/v17/editor/...

is actually pointing…


Also, if I were to use Square's Developer APIs to write my own frontend, which I am assuming would give me more control over the verbosity of my queries, would I be interfacing with SquareUp's or Weebly's Database through the API?

Sorry, I have not had a chance to dive into the Square Developer tools yet.

That’s great that they are looking into this. The Square Online Store does use our Catalog API. However not everything that is available with items and images with the online store is available with the API.

If you decide to write your own frontend you would be interfacing with Square’s data with the APIs. :slightly_smiling_face:

1 Like