performance - 用 livereload Grunt ,减慢

标签 performance gruntjs livereload

这是我的Gruntfile.js

watch: {
            options: { livereload: true },
            compass: {
                files: ['assets/sass/*.{scss,sass}'],
                tasks: ['compass']
            },
            // js: {
            //  files: '<%= jshint.all %>',
            //  tasks: ['jshint', 'uglify']
            // },
            livereload: {
                // files: ['*.html', '*.php', 'assets/stylesheets/**/*.{css}']
                files: ['*.html', '*.php', 'assets/stylesheets/custom.css']
            }
        },

        // compass and scss
        compass: {
            dist: {
                options: {
                config: 'config.rb',
                force: true
                }
            }
        },

这是 grunt watch 的输出:
Done, without errors.
... Reload assets/sass/custom.scss ...
... Reload assets/stylesheets/custom.css ...
Completed in 11.033s at Fri Dec 06 2013 14:20:48 GMT+0100 (CET) - Waiting...
OK
>> File "assets/stylesheets/custom.css" changed.
>> File "assets/sass/custom.scss" changed.

Running "compass:dist" (compass) task
overwrite assets/stylesheets/custom.css (0.701s)
identical assets/stylesheets/app.css (3.452s)
Compilation took 4.158s

Done, without errors.
... Reload assets/sass/custom.scss ...
... Reload assets/stylesheets/custom.css ...
Completed in 10.719s at Fri Dec 06 2013 14:21:53 GMT+0100 (CET) - Waiting...

  • ..so,为什么 livereload 需要这么多时间来刷新页面,
    10 秒预览我的 .scss 文件中的任何更改,以及它会如何
    可能不完全刷新页面,但只注入(inject) .css 更改
    在页面?
  • ..我想知道的另一件事是如何避免这种情况
    app.css 上的编译延迟,几乎花了 4 秒,但不是
    甚至改变了?

  • 我正在使用带有此配置的 livereload 浏览器扩展。

    谢谢。

    最佳答案

    1a:要加快监视任务的速度,请尝试选项 spawn:false。这可能会使事情变得不稳定,但值得一试。如果看起来没问题,那就去吧。但是,如果您将许多不同的任务添加到监视任务中,它可能会在以后给您带来问题。但是您可以担心这一点并可能禁用它。

    1b:

    首先不要为指南针任务启用 livereload。 (您在全局范围内拥有它,仅在 css 中使用)因此,它也会触发 scss 文件的 livereload 事件。但是由于 livereload 客户端不知道这个文件,所以它会重新加载整个页面。确保唯一报告的文件是编译后的 css。

    其次,监视任务也将触发以前更改的文件的 livereload。这是已知的,但我相信它已在 master 中修复,但尚未发布。

    https://github.com/gruntjs/grunt-contrib-watch/issues/205

    2:

    那么它必须编译它来比较它,然后它只是报告它是相同的。

    关于performance - 用 livereload Grunt ,减慢,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20425391/

    相关文章:

    c++ - [C++][SFML 2.2] 奇怪的性能问题 - 移动鼠标会降低 CPU 使用率

    python - 在 mysql 中更新数千行的最快方法是什么

    node.js - Gruntjs - 以特定顺序运行多个阻塞任务(Mongo 和 Node.js)

    gruntjs - 如何让 grunt-watch 实时重新加载正确的 css 文件?

    ios - ionic 4 - livereload 不起作用

    PHP 缓存 MySQL 结果的最佳方法?

    javascript - 如何检测由贝塞尔曲线制成的物体与圆之间的碰撞?

    build - angular-ui-bootstrap 缩小时会导致未知的提供程序错误

    css - gulpfile.js 帮助添加实时重新加载

    node.js - 如何让 node-sass watch 和 live reload 从单个 NPM 脚本运行?