How to find unused CSS from rails? deadweight not working [closed]


Tags: css,ruby-on-rails,ruby,ruby-on-rails-4

Problem :

As the title says, I want to 'purify' the CSS of my rdails application, to find unused CSS selectors.

I found a gem called deadweight, but is too old. I can't event install it today (Dependencies failing)

So, is there another or actual way to clean the CSS? or an alternative to deadweight?

Thanks a lot!



Solution :

As mentioned in the comment, there is a good reason why you shouldn't be looking for such a tool - javascript. Even though, given selector might not exist in your templates, you might have some javascript which will add a class to one DOM element, an attribute to another and you might have another rare case which will add another class to another element or move it complete somewhere else inside the DOM.

To actually find whether your CSS selector exists or not, your tool would need to render all your templates and keep executing random js events until given selector shows off - and it will need to be able to tell whether it is ever gona find it. This is a halting problem, proved to be computable impossible to solve.

That being said, you can always use tools like the one listed on other answers - they might give you a list of suspicious selectors, however you will need to spend significant amount of time with every single one of them to find if there is a single case in your application when it can actually be used.

Word of warning: DustMe crawl the website through all the links on your page to get a better view of whole website - you don't use link_to ..., method: <post|delete|put>, do you?


    CSS Howto..

    How to Make Auto Size Horizontal Line DIV using css?

    How can i reposition a sub ul in a responsive web site

    How to interchange table cells using Pure CSS

    how to display only 100 rows of 1000 from a database with options to go to next 100 and previous 100 in html/php/css/js [closed]

    How can I apply CSS to an HTML text input?

    Why the space after the table, and how to remove it?

    How to select a div with specific css property

    How do I center two divs within a larger div?

    How to make the long text to fit inside a small div?

    How to create a two vertically stacked buttons next to a text input

    How to set cursor off screen?

    How can I add vertical space to a horizontal list?

    How to completely remove borders from HTML table

    How to apply first-child:first-letter to only one section?

    How to style CSS role

    How to get multiple rotating background cover with css / Full screen slideshow

    CSS - how to set some divs inline

    How to get the last Element of CSS?

    How to clear the bottom of an image like clear left / right

    How to make a “wrappanel” in html?

    How to NOT trigger hover effect on table row when hovering over specific element inside it

    How to select that has no “type” with CSS

    How to use nth-child with only direct children?

    CSS: how can I make this table fit the border when resized?

    How to make layout with fixed sized column in Liferay?

    How to stop active effect occurring on all sub menu options from navbar

    TW Bootstrap: How to overflow columns

    How to add CSS for dynamic MenuItems in MenuList and How to get the value of the MenuItem in XUL

    How to have a hidable paragraph in an HTML email template

    How to override parent containers width property in CSS [duplicate]