Sponsored Content
Full Discussion: Optimizing JS and CSS
Top Forums Web Development Optimizing JS and CSS Post 303030913 by Neo on Tuesday 19th of February 2019 06:28:55 AM
Old 02-19-2019
Hi Akshay,

First, let me say that I normally minimize CSS and Javascript using:
  • uglifyjs
  • uglifycss

and both seem to work fine.

Also, it's not really necessary, or even a good idea, to combine all JS files into one big JS minimize file for a number of reasons.

It is not good to "over optimize" and little really great comes of it, in my view.

Most sites like this are changing often and there is always a lot of Javascript code to write, modify, change and debug. Creating "mothers of all minimized Javascript files" make things "a nightmare" and it is better to smartly combine them, and that cannot be done by tool because we need to know that we are developing, where the issues are, what is changing, and what is static.

But anyway, I'm not focused on it and it is not on the site development critical path to worry about minimizing more JS and CSS. I have a lot more important functional code to write for the next month or so.

Cheers and Thanks!
 

4 More Discussions You Might Find Interesting

1. Shell Programming and Scripting

sed remove css comments

Is there a way that I can use sed to remove lines with css comments like this? /* comment */ (9 Replies)
Discussion started by: gravesit
9 Replies

2. Web Development

On Css

<html> <head> <style> div.box {width: 300px; height: 200px; padding: 30px; font: 46 pt times new roman;} </style> </head> <body> <div class="box" style=" filter": progid:DXImagetransform.Microsoft.Alpha (Opacity=100, FinishOpacity=0, Style=1, StartX=0, FinishX=0,... (0 Replies)
Discussion started by: N-Training
0 Replies

3. Web Development

HTML down, CSS help, ahhhh

I am having some problems. I have been able to learn HTML, but when I try and encode CSS, nothing happens, what is the major issue here. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>MY CSS</title> <style... (7 Replies)
Discussion started by: N-Training
7 Replies

4. Web Development

CSS frameworks

I have been reading up on CSS frameworks, to see if it could be useful for an intranet that I am helping to build, but the true purpose does not become clear to me. What circumstances would the deployment of a CSS framework be useful in? What does a CSS framework do that a CMS template cannot do? (1 Reply)
Discussion started by: figaro
1 Replies
Mojo::DOM::CSS(3pm)					User Contributed Perl Documentation				       Mojo::DOM::CSS(3pm)

NAME
Mojo::DOM::CSS - CSS3 selector engine SYNOPSIS
use Mojo::DOM::CSS; # Select elements from DOM tree my $css = Mojo::DOM::CSS->new(tree => $tree); my $elements = $css->select('h1, h2, h3'); DESCRIPTION
Mojo::DOM::CSS is the CSS3 selector engine used by Mojo::DOM. SELECTORS
All CSS3 selectors that make sense for a standalone parser are supported. "*" Any element. my $all = $css->select('*'); "E" An element of type "E". my $title = $css->select('title'); "E[foo]" An "E" element with a "foo" attribute. my $links = $css->select('a[href]'); "E[foo="bar"]" An "E" element whose "foo" attribute value is exactly equal to "bar". my $fields = $css->select('input[name="foo"]'); "E[foo~="bar"]" An "E" element whose "foo" attribute value is a list of whitespace-separated values, one of which is exactly equal to "bar". my $fields = $css->select('input[name~="foo"]'); "E[foo^="bar"]" An "E" element whose "foo" attribute value begins exactly with the string "bar". my $fields = $css->select('input[name^="f"]'); "E[foo$="bar"]" An "E" element whose "foo" attribute value ends exactly with the string "bar". my $fields = $css->select('input[name$="o"]'); "E[foo*="bar"]" An "E" element whose "foo" attribute value contains the substring "bar". my $fields = $css->select('input[name*="fo"]'); "E:root" An "E" element, root of the document. my $root = $css->select(':root'); "E:checked" A user interface element "E" which is checked (for instance a radio-button or checkbox). my $input = $css->select(':checked'); "E:empty" An "E" element that has no children (including text nodes). my $empty = $css->select(':empty'); "E:nth-child(n)" An "E" element, the "n-th" child of its parent. my $third = $css->select('div:nth-child(3)'); my $odd = $css->select('div:nth-child(odd)'); my $even = $css->select('div:nth-child(even)'); my $top3 = $css->select('div:nth-child(-n+3)'); "E:nth-last-child(n)" An "E" element, the "n-th" child of its parent, counting from the last one. my $third = $css->select('div:nth-last-child(3)'); my $odd = $css->select('div:nth-last-child(odd)'); my $even = $css->select('div:nth-last-child(even)'); my $bottom3 = $css->select('div:nth-last-child(-n+3)'); "E:nth-of-type(n)" An "E" element, the "n-th" sibling of its type. my $third = $css->select('div:nth-of-type(3)'); my $odd = $css->select('div:nth-of-type(odd)'); my $even = $css->select('div:nth-of-type(even)'); my $top3 = $css->select('div:nth-of-type(-n+3)'); "E:nth-last-of-type(n)" An "E" element, the "n-th" sibling of its type, counting from the last one. my $third = $css->select('div:nth-last-of-type(3)'); my $odd = $css->select('div:nth-last-of-type(odd)'); my $even = $css->select('div:nth-last-of-type(even)'); my $bottom3 = $css->select('div:nth-last-of-type(-n+3)'); "E:first-child" An "E" element, first child of its parent. my $first = $css->select('div p:first-child'); "E:last-child" An "E" element, last child of its parent. my $last = $css->select('div p:last-child'); "E:first-of-type" An "E" element, first sibling of its type. my $first = $css->select('div p:first-of-type'); "E:last-of-type" An "E" element, last sibling of its type. my $last = $css->select('div p:last-of-type'); "E:only-child" An "E" element, only child of its parent. my $lonely = $css->select('div p:only-child'); "E:only-of-type" An "E" element, only sibling of its type. my $lonely = $css->select('div p:only-of-type'); "E.warning" my $warning = $css->select('div.warning'); An "E" element whose class is "warning". "E#myid" my $foo = $css->select('div#foo'); An "E" element with "ID" equal to "myid". E:not(s) An "E" element that does not match simple selector "s". my $others = $css->select('div p:not(:first-child)'); "E F" An "F" element descendant of an "E" element. my $headlines = $css->select('div h1'); "E > F" An "F" element child of an "E" element. my $headlines = $css->select('html > body > div > h1'); "E + F" An "F" element immediately preceded by an "E" element. my $second = $css->select('h1 + h2'); "E ~ F" An "F" element preceded by an "E" element. my $second = $css->select('h1 ~ h2'); "E, F, G" Elements of type "E", "F" and "G". my $headlines = $css->select('h1, h2, h3'); "E[foo=bar][bar=baz]" An "E" element whose attributes match all following attribute selectors. my $links = $css->select('a[foo^="b"][foo$="ar"]'); ATTRIBUTES
Mojo::DOM::CSS implements the following attributes. "tree" my $tree = $css->tree; $css = $css->tree(['root', [qw(text lalala)]]); Document Object Model. METHODS
Mojo::DOM::CSS inherits all methods from Mojo::Base and implements the following new ones. "select" my $results = $css->select('head > title'); Run CSS3 selector against "tree". SEE ALSO
Mojolicious, Mojolicious::Guides, <http://mojolicio.us>. perl v5.14.2 2012-09-05 Mojo::DOM::CSS(3pm)
All times are GMT -4. The time now is 03:16 AM.
Unix & Linux Forums Content Copyright 1993-2022. All Rights Reserved.
Privacy Policy