Suggestions on why site is slow/how to speed up?

2019-09-19 02:56发布

站内问答 / 移动开发
920 2 4

I know the website is very image based, I have limited plugins as much as I can and compressed CSS and styling. It shouldn't be as slow as it is. Any reason why this or what I can do to speed it up? Thanks

2条回答
冷血范
2楼-- · 2019-09-19 03:03

in my opinion

1- you are using too much css and javascript
2- Eliminate render-blocking JavaScript and CSS in above-the-fold content
3- you should optimize your image
4- you can upgrade your server to faster server
5- Enable compression and browser caching
and .....

EDIT: how improve above steps:

1- for better performance its better to keep page size under 600kbit usually it's because of theme or the plugin we use, then if you can, change your template to an optimize version and reduce your unnecessary plugins. on the other hand there are some features that can handle by just few codes, but we rather to install a new plugin so new plugins has its self javascript and css

2-put all your javascript codes on the footer befoter </body> (help), and create a javascript loader for your css, that insert your css on the head.(help) simple example of render-blocking

<!DOCTYPE html>
<html>
<head>
    <title>Title</title>
    <!-- do not insert css or javascript here -->
</head>
<body>
<!--
 #################
    contents
#################
 -->
<script type="text/javascript" src="/dis/cssloader.js"></script>
<script type="text/javascript" src="/dis/scripts.js"></script>
</body>
</html>

and your cssloader 

//cssloader.js
var version = "?v1";
var cb = function() {
    var styles = [
        "/dist/custom1.min.css",
        "/dist/custom1.min.css",
    ];
    var h = document.getElementsByTagName('head')[0];
    for (var i = 0; i < styles.length; i++) {
        var l = document.createElement('link');
        l.rel = 'stylesheet';
        l.href = styles[i]+version;
        h.appendChild(l);
    }
};
var raf = requestAnimationFrame || mozRequestAnimationFrame || webkitRequestAnimationFrame || msRequestAnimationFrame;
if (raf) raf(cb);
else window.addEventListener('load', cb);



3- optimizing image means to reduce your image scale as you can, and saved your images for web (if your are using photoshop it has an option to do this, it's obvious that it reduce your images quality )

4-sometime just some configuration on server , improve it's performance 5- if your are using apache, you should add some line of codes on your apache config so that comperssion and caching enable for it, you can do this by .htaccess too (help)(help)

查看更多
0人赞 添加讨论(0) 举报
一夜七次
3楼-- · 2019-09-19 03:16

This suffers from a grotesque amount of Javascript and CSS. Minifying them into a single file each or at least consistently using their minified versions will help, but at 7.1MB for a single page, including a 1.1MB image, you might consider that you're doing something fundamentally wrong regarding page design and use of images. Even on a fast desktop this is slow, and even with minified styles and scripts (and resized, not just 'optimized', images), on mobile it'll (still) be unusable.

Edit: That size is with ghostery enabled, so it's likely a bit on the low side, and those won't do anything to help your load time.

查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)