Fine Uploader session 缩略图加载缓慢

Question

我正在使用 Fine Uploader 为社区站点创建模型文件上传工具。

我已将会话设置为从服务器检索初始文件以及缩略图 url。

一切都很好，但是缩略图的渲染真的很慢。我不知道为什么。所以我硬编码为四个文件中的每一个都使用一个非常小的缩略图。这没有什么区别。

服务器端不是问题。信息回来的很快。

我是不是做错了什么？为什么 fineuploader 这么慢？这是屏幕抓取。渲染四个缩略图需要四秒钟。

我使用的是最新的 chrome。这是一个功能相当强大的机器上的 NancyFX 项目。渲染带有大图像的其他页面很活泼。

客户端代码：

thumbnails: {
                placeholders: {
                    waitingPath: '/Content/js/fine-uploader/placeholders/waiting-generic.png',
                    notAvailablePath: '/Content/js/fine-uploader/placeholders/not_available-generic.png'
                }
            },
            session: {
                endpoint: "/getfiles/FlickaId/342"
            },

服务器端代码：

        // Fine uploader makes session request to get existing files
        Get["/getfiles/FlickaId/{FlickaId}"] = parameters =>
        {
            //get the image files from the server
            var i = FilesDatabase.GetFlickaImagesById(parameters.FlickaId);

            // list to hold the files
            var list = new List<UploadedFiles>();

            // build the response data object list
            foreach (var imageFile in i)
            {
                var f = new UploadedFiles();

                f.name = "test-thumb-small.jpg"; // imageFile.ImageFileName;
                f.size = 1;
                f.uuid = imageFile.FileGuid;
                f.thumbnailUrl = "/Content/images/flickabase/thumbnails/" + "test-thumb-small.jpg"; // imageFile.ImageFileName; 

                list.Add(f);
            }

            return Response.AsJson(list); // our model is serialised by Nancy as Json!

        };

Answer 1

这是设计使然，其实施既是为了防止 UI 线程被图像缩放逻辑淹没，也是为了防止特定于 Chrome 的内存泄漏问题。这在文档的缩略图和预览部分进行了解释，特别是在 the "performance considerations" area:

For browsers that support client-generated image previews (qq.supportedFeatures.imagePreviews === true), a configurable pause between template-generated previews is in effect. This is to prevent the complex process of generating previews from overwhelming the client machine's CPU for a lengthy amount of time. Without this limit in place, the browser's UI thread runs the risk of blocking, preventing any user interaction (scrolling, etc) until all previews have been generated.

您可以通过 the thumbnails option 调整或删除此暂停，但我建议您不要这样做，除非您确定用户不会丢弃大量复杂的图像文件。

Fine Uploader session 缩略图加载缓慢

Fine Uploader session Thumbnails slow to load

c#

session

thumbnails

nancy

fine-uploader