为什么我的解决方案如此缓慢？如何提高查询的性能？

Question

目前我能够优化性能,但它仍然有点慢:/

最新编辑:

我目前的解决方案(最快的atm(但仍然很慢)并保持秩序):

服务器

router.post('/images', function(req, res, next) {
    var image = bucket.file(req.body.image);
    image.download(function(err, contents) {
        if (err) {
            console.log(err);
        } else {
            var resultImage = base64_encode(contents);
            var index = req.body.index;
            var returnObject = {
                image: resultImage,
                index: index
            }
            res.send(returnObject);
        }
    });
});

客户端查询

$scope.getDataset = function() {

                fb.orderByChild('id').startAt(_start).limitToFirst(_n).once("value", function(dataSnapshot) {

                    dataSnapshot.forEach(function(childDataSnapshot) {
                        _start = childDataSnapshot.child("id").val() + 1;

                        var post = childDataSnapshot.val();
                        var image = post.image;

                        var imageObject = {
                            image: image,
                            index: position
                        };
                        position++;
                        $.ajax({
                            type: "POST",
                            url: "images",
                            data: imageObject,
                        }).done(function(result) {
                            post.image = result.image;
                            $scope.data[result.index] = post;
                            $scope.$apply();
                            firstElementsLoaded = true; 
                        });
                    })  
                });
            };

客户端HTML

<div ng-controller="ctrl">
        <div class="allcontent">
            <div id="pageContent" ng-repeat="d in data track by $index"><a href="details/{{d.key}}" target="_blank"><h3 class="text-left">{{d.title}}<a href="../users/{{d.author}}"><span class="authorLegend"><i> by {{d.username}}</i></span></a></h3>
                </a>
                <div class="postImgIndex" ng-show="{{d.upvotes - d.downvotes > -50}}">
                    <a href="details/{{d.key}}" target="_blank"><img class="imgIndex" ng-src="data:image/png;base64,{{d.image}}"></a>
                </div>
                <div class="postScore">{{d.upvotes - d.downvotes}} HP</div>
            </div>
        </div>
    </div>

Answer 1

您的解决方案速度很慢，因为您正在从云存储下载图像并将其提供在您自己的服务器上。下载和上传会出现延迟，使用 Base64 编码数据会产生约 33% 的开销，而且您的服务器在传送图像方面承受着巨大压力，而不是专注于传送网站内容。

\n\n

正如许多评论所指出的，最佳实践解决方案是使用图像的公共 URL，如下所示：

\n\n

function getPublicUrl (filename) {\n  return "https://storage.googleapis.com/${CLOUD_BUCKET}/${filename}";\n}\n

\n\n

通过使用公共 URL，您可以利用 Google\xe2\x80\x99s 全球服务基础架构直接从Cloud Storage 提供服务。并且应用程序不必响应图像请求，从而为其他请求释放 CPU 周期。

\n\n

如果您不希望机器人使用上述方法抓取您的图片，Google 建议使用robots.txt文件来阻止对您的图片的访问。

\n