Сделать скорость SASS такой же быстрой, как CSS в Синатре - PullRequest
Новая
       13

Сделать скорость SASS такой же быстрой, как CSS в Синатре

0 голосов
/ 23 ноября 2011

Привет, давайте сначала посмотрим код.

Я использую тонкий в качестве шаблона представления в Синатре.

Фрагмент 1 : файл шаблона, index.slim 

doctype html
html
    head
        title = @title
        link rel='stylesheet' type='text/css' href='css/origin.css'
        link rel='stylesheet' type='text/css' href='css/sass.css'
    body
        div This is a test for SASS

Фрагмент 2 : управляющий файл, route.rb, который является файлом приложения sinatra 

require "sass"

configure do
    set :sass, :cache => true, :cache_location => './tmp/sass-cache', :style => :compressed
end

get '/' do
    @title = 'default page'
    slim :index
end

get '/css/sass.css' do
    sass :index
end

Фрагмент 3 : файл стиля

index.sass в папке моих просмотров, которая является путем к шаблону 

div
    color: white
    background: green

origin.css в /public/css/orgin.css, который является путем стиля по умолчанию 

div {padding: 10px;margin: 10px;}

Фрагмент 4: Это журнал сервера, который показывает скорость файла orgin css и файла sass 

[coolesting@localhost ds]$ rackup 
[2011-11-23 00:02:36] INFO  WEBrick 1.3.1
[2011-11-23 00:02:36] INFO  ruby 1.9.2 (2011-07-09) [i686-linux]
[2011-11-23 00:02:36] INFO  WEBrick::HTTPServer#start: pid=5285 port=9292
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET / HTTP/1.1" 200 283 0.0261
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET /css/origin.css HTTP/1.1" 304 - 0.0005
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET /css/sass.css HTTP/1.1" 200 64 0.0060
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET / HTTP/1.1" 200 283 0.0029
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET /css/origin.css HTTP/1.1" 304 - 0.0005
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET /css/sass.css HTTP/1.1" 200 64 0.0029
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET / HTTP/1.1" 200 283 0.0190
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET /css/origin.css HTTP/1.1" 304 - 0.0005
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET /css/sass.css HTTP/1.1" 200 64 0.0043
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET / HTTP/1.1" 200 283 0.0029
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET /css/origin.css HTTP/1.1" 304 - 0.0005
127.0.0.1 - - [23/Nov/2011 00:02:38] "GET /css/sass.css HTTP/1.1" 200 64 0.0012
127.0.0.1 - - [23/Nov/2011 00:02:39] "GET / HTTP/1.1" 200 283 0.0056
127.0.0.1 - - [23/Nov/2011 00:02:39] "GET /css/sass.css HTTP/1.1" 200 64 0.0016
127.0.0.1 - - [23/Nov/2011 00:02:39] "GET /css/origin.css HTTP/1.1" 304 - 0.0187
127.0.0.1 - - [23/Nov/2011 00:02:39] "GET / HTTP/1.1" 200 283 0.0028
127.0.0.1 - - [23/Nov/2011 00:02:39] "GET /css/origin.css HTTP/1.1" 304 - 0.0005
127.0.0.1 - - [23/Nov/2011 00:02:39] "GET /css/sass.css HTTP/1.1" 200 64 0.0011

Итак, как заставить sass-файл работать так же быстро, как и исходный css-файл, я включил кэш, но он медленнее, чем исходный css.

Или какое решение позволить веб-серверу напрямую читать файл CSS, который отображается из файла sass.

Ответы [ 2 ]

0 голосов
/ 25 ноября 2011

Вы всегда можете вручную создать css-файлы из scss и поместить их в публичный каталогВ противном случае кеш sass уже довольно быстрый.

0 голосов
/ 23 ноября 2011

:cache => true, :cache_location => '...' используется для настройки внутреннего кэша SASS (который создает файлы .sassc для экономии времени при компиляции в css). Так что этот кеш не мешает вашему приложению Sinatra запускать SASS каждый раз, когда браузер запрашивает /css/sass.css.

Что вам действительно нужно, так это чтобы SASS отображал css (скомпилированный из index.sass) в файл public / css / sass.css. Затем он будет подхвачен механизмом статической загрузки, таким как файл public / css / original.css. Для этого взгляните на

http://sass -lang.com / Docs / yardoc / file.SASS_REFERENCE.html # опции

специально для опций :template_location и :css_location

...