[olle_t]

I’m experiencing very poor performance and unresponsiveness in the CSS editor. The key response is lagging from 0.5s to almost a whole second some times.

I followed some old threads (http://www.myeclipseide.com/PNphpBB2+file-viewtopic-t-10794-highlight-slow+editor.html) on the same subject and tried some other startup parameters, but no improvement.

Using: –vmargs -Xms128m -Xmx512m -XX:PermSize=64M -XX:MaxPermSize=128M

I’m currently working on a Mac iBook G4 1.2GHz with 1.25GB RAM, and I know it’s not a speed machine but I’m hoping for some feedback on ways to keep the color-coding on, but turn all other validation and contextual aids off.

I have not encountered the lack of performance in the Java, JSP or HTML-editor, on this system, which makes me believe that the problems are editor-optimization issues.

Please advice, and please review the CSS-editor code if there are things to do to boost performance.

Thank you for an otherwise great product.

[olle_t]

BUG: Slow performance in CSS-editor, unresponsiveness on key-events up to 0.5-1s

PLATFORM:
System: Mac iBook G4, 1.2GHz, 1.25GB RAM
MyEclipse Startup arguments: –vmargs -Xms128m -Xmx512m -XX:PermSize=64M -XX:MaxPermSize=128M

REPRODUCE:
1. Copy paste CSS code posted below
2. Edit CSS, defining new style sheet class element

EXPECTED: Normal performance, decent responsiveness comparable to JAVA, JSP and HTML-editor on same system.

/* ************************************************************************** */
/* FLOAT BREAKER ************************************************************ */
.breaker {
    overflow: hidden;
    width: 0px;
    height: 0px;
    background-color: red;
    clear: both;
}
/* ************************************************************************** */


/* ************************************************************************** */
/* MAIN FONT STYLE ********************************************************** */
.main_font {
    font: normal 11px arial, helvetica, verdana, sans-serif;
}
/* ************************************************************************** */


/* ************************************************************************** */
/* General page layout blocks *********************************************** */
#div_contentcontainer {
    width: 986px;
    background-color: #000000;
    text-align: center;
    padding: 10px 5px 0px 5px;
    border: 0px solid red;
    font: 12px arial, helvetica, sans-serif;
    line-height: 13pt;
    background-image: url(/img/main_container_menu_bg.png);
    background-repeat: no-repeat;
}

#div_contentcontainer p {
    margin: 5px 0px 5px 0px;
}

#div_left_column_container {
    float: left;
    width: 121px;
}

#div_middle_column_container {
    float: left;
    width: 605px;
}

.div_margin_column {
    float: left;
    width: 10px;
    height: 10px;
}

#div_right_column_container {
    float: left;
    width: 250px;
}

#header_left_col {
    width: 121px;
    height: 57px;
    overflow: hidden;
}

.header_middle_col {
    width: 605px;
    height: 57px;
    overflow: hidden;
    background-color: none;
}

.header_right_col {
    width: 250px;
    height: 57px;
    overflow: hidden;
}

#content_left_col {
    width: 121px;
}

#content_middle_col {
    width: 575px;
    background-color: #f1f6fc;
    padding: 15px 15px 15px 15px;
    text-align: left;
}

.content_middle_column_wide {
    float: left;
    width: 336px;
    padding: 0px 0px 0px 20px;
    background-color: none;
    text-align: left;
}

.content_middle_column_narr {
    float: left;
    width: 219px;
    padding: 0px 0px 0px 0px;
    text-align: left;
    background-color: none;
}

.content_right_col {
    width: 250px;
}


.content_wrapper {
    margin: 12px 12px 12px 12px;
}

.left_content {
    text-align: left;
    vertical-align: middle;
    width: 121px;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
    background-color: #d9e2ed;
    font: 1px verdana, arial, tahoma, geneva, helvetica, sans-serif;
}

/* ************************************************************************** */
/* Left column menu ********************************************************* */
#left_menu {
    width: 121px;
    padding: 0px;
    margin: 0px;
    background: url(/img/gradient.png) top left repeat-y;
    font-size: 1px;
}

#left_menu ul {
    width: 121px;
    padding: 0px;
    margin: 0px;
    list-style: none;
}

#left_menu ul li {
    height: 19px;
    width: 121px;
    padding: 0px;
    border-bottom: 1px solid #000000;
    text-align: left;
    /* font: bold 11px arial, helvetica, sans-serif; */
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    overflow: hidden;
}

#left_menu ul li#left_menu_topitem_selected {
    height: 9px;
    width: 121px;
    border: 0px;
    background: url(/img/menutop_selected.png) top left
        no-repeat;
    font-size: 1px;
}

#left_menu ul li#left_menu_topitem_unselected {
    height: 9px;
    width: 121px;
    border: 0px;
    background: url(/img/menutop_unselected.png) top left
        no-repeat;
    font-size: 1px;
}

#left_menu ul li a {
    display: block;
    text-decoration: none;
    padding: 4px 0px 0px 0px;
    margin: 0px 0px 0px 5px;
    color: #000000;
}

#left_menu ul li a:active {
    color: #000000;
}

#left_menu ul li a:hover {
    color: #000000;
    text-decoration: underline;
}

.left_menu_item_selected {
    background-color: #f1f6fc;
}

#left_menu ul li.left_menu_groupspacer {
    width: 121px;
    height: 3px;
    padding: 0px;
    margin: 0xp;
    border: 0px;
    background-color: #000000;
    font-size: 1px;
}

.left_menu_itemcounter {
    color: #994100;
    font-size: 10px;
    font-weight: bold;
}

/* ************************************************************************** */
/* SIMPLE TABBED MENU ******************************************************* */
.simple_tabs {
    float: left;
    width: 100%;
    height: 30px;
    background: url(/img/simple_tabs_bg.gif) bottom left repeat-x;
    margin: 0px 0px 25px 0px;    
}

.simple_tabs_wo_margin {
    float: left;
    width: 100%;
    height: 30px;
    background: url(/img/simple_tabs_bg.gif) bottom left repeat-x;
    margin: 0px 0px 0px 0px;    
}

.simple_tabs ul,
.simple_tabs_wo_margin ul {
    float: left;
    list-style: none;
    width: 100%;
    padding: 0px;
    margin: 0px;
}

.simple_tabs ul li,
.simple_tabs_wo_margin ul li {
    margin: 0px 2px 0px 0px;
    float: left;
    height: 25px;
    background-color: #9CA2AF;
}

.simple_tabs ul li:hover,
.simple_tabs_wo_margin ul li:hover {
    cursor: pointer;
}

.simple_tabs ul li.selected,
.simple_tabs_wo_margin ul li.selected {
    padding: 0px;
    margin: 0px 2px 0px 0px;
    float: left;
    height: 25px;
    background-color: #C6CCD8;
}

.simple_tabs ul li a,
.simple_tabs ul li a:active,
.simple_tabs ul li a:visited,
.simple_tabs_wo_margin ul li a,
.simple_tabs_wo_margin ul li a:active,
.simple_tabs_wo_margin ul li a:visited {
    font-size: 11px;
    font-weight: bold;
    text-decoration: none;
    color: #ffffff;
    margin: 0px 10px;
    position: relative;
    top: 6px;
    _top: 7px;
    vertical-align: middle;
}

.simple_tabs ul li.selected p,
.simple_tabs_wo_margin ul li.selected p {
    font-size: 11px;
    font-weight: bold;
    text-decoration: none;
    color: #000000;
    display: inline;
    position: relative;
    margin: 0px 10px 0px 10px !important;
    top: 6px;
    _top: 7px;
    vertical-align: middle;
}

.simple_tabs ul li a:hover,
.simple_tabs_wo_margin ul li a:hover {
    text-decoration: underline;
}
/* ************************************************************************** */


/* ************************************************************************** */
.article_heading {
    font: 20px arial, verdana, tahoma, geneva, helvetica, sans-serif;
    line-height: 14pt;
    font-weight: bold;
    color: #944700;
}

.article_heading a:link {
    color: #944700;
    text-decoration: none;
}

.article_heading a:visited {
    color: #944700;
    text-decoration: none;
}

.article_heading a:hover {
    color: #944700;
    text-decoration: underline;
}

.article_subheading {
    font: 16px arial, verdana, tahoma, geneva, helvetica, sans-serif;
    line-height: 14pt;
    font-weight: bold;
    padding: 0px 0px 0px 0px;
    color: #944700;
}

.article_subheading a:link {
    color: #944700;
    text-decoration: none;
}

.article_subheading a:visited {
    color: #944700;
    text-decoration: none;
}

.article_subheading a:hover {
    color: #944700;
    text-decoration: underline;
}

.article_date {
    font: 10px verdana, arial, tahoma, geneva, helvetica, sans-serif;
    line-height: 10pt;
    font-weight: normal;
    color: #898989;
}

.article_ingress {
    font: 12px arial, verdana, tahoma, geneva, helvetica, sans-serif;
    line-height: 11pt;
    font-weight: bold;
    color: #000000;
}

.article_body_matter {
    font: 12px arial, verdana, tahoma, geneva, helvetica, sans-serif;
    line-height: 11pt;
    font-weight: normal;
    color: #000000;
}

.article_comment_header {
    font: 10px verdana, arial, tahoma, geneva, helvetica, sans-serif;
    line-height: 11pt;
    font-weight: bold;
    padding: 8px 0px 0px 0px;
    color: #606060;
}

.article_comment_text {
    font: 9px verdana, arial, tahoma, geneva, helvetica, sans-serif;
    line-height: 8pt;
    font-weight: normal;
    color: #944700;
}

.article_comment_text a:link {
    color: #944700;
    text-decoration: none;
}

.article_comment_text a:visited {
    color: #944700;
    text-decoration: none;
}

.article_comment_text a:hover {
    color: #944700;
    text-decoration: underline;
}

.article_top_picture {
    margin: 0px 20px 0px 0px;
    float: left;
}

.article_picture {
    margin: 0px 0px 5px 5px;
    float: right;
}

.hr {
    margin: 8px 0px 8px 0px;
    color: #b0b7c1;
    background-color: #b0b7c1;
}

.narr_column_headerbg {
    height: 15px;
    float: left;
    background-color: #b3bcc7;
    padding: 3px 5px 0px 5px;
    margin: 0px;
}

#header_middle_top {
    width: 605px;
    height: 39px;
    overflow: hidden;
    background-color: none;
    text-align: right;
    font: 9px verdana, arial, tahoma, geneva, helvetica, sans-serif;
    font-weight: bold;
    padding: 0px;
    color: #ffffff;
    background-image: url(/img/payoff.png);
    background-repeat: no-repeat;
}

#header_middle_top a:link {
    color: #d6eb82;
    text-decoration: none;
}

#header_middle_top a:visited {
    color: #d6eb82;
    text-decoration: none;
}

#header_middle_top a:hover {
    color: #d6eb82;
    text-decoration: underline;
}

/* ************************************************************************** */
/* Tabbed navigation on page top ******************************************** */
#header_middle_bot {
    width: 597px;
    height: 18px;
    background-color: none;
    text-align: middle;
    font: 9px verdana, arial, tahoma, geneva, helvetica, sans-serif;
    font-weight: bold;
    padding: 0px 0px 0px 8px;
    color: #000000;
}

.header_middle_bot a:link {
    color: #000000;
    text-decoration: none;
}

.header_middle_bot a:visited {
    color: #000000;
    text-decoration: none;
}

.header_middle_bot a:hover {
    color: #000000;
    text-decoration: underline;
}

.tabfloater_left_tab {
    padding: 0px;
    margin: 0px;
}

.tabfloater_right_tab {
    padding: 0px;
    margin: 0px;
    float: right;
    border: 0px solid red;
}

.tab_menucorner_left_sel {
    float: left;
    width: 2px;
    height: 18px;
    padding: 0px;
    margin: 0px;
    background: url(/img/topmenu_menucorner_sel.png) top left
        no-repeat;
}

.tab_menucorner_left_uns {
    float: left;
    width: 2px;
    height: 18px;
    padding: 0px;
    margin: 0px;
    background: url(/img/topmenu_menucorner_uns.png) top left
        no-repeat;
}

.tab_corner_left_sel {
    float: left;
    width: 4px;
    height: 18px;
    padding: 0px;
    margin: 0px;
    background: url(/img/topmenu_leftcorner_sel.png) top left
        no-repeat;
}

.tab_corner_left_uns {
    float: left;
    width: 4px;
    height: 18px;
    font-weight: bold;
    padding: 0px;
    margin: 0px;
    background: url(/img/topmenu_leftcorner_uns.png) top left
        no-repeat;
}

.tab_body_sel {
    height: 15px;
    float: left;
    background: #f1f6fc url(/img/topmenu_body_sel.png) top left
        repeat-x;
    padding: 3px 5px 0px 5px;
    margin: 0px;
}

.tab_body_uns {
    height: 15px;
    float: left;
    background: #b3bcc7 url(/img/topmenu_body_uns.png) top left
        repeat-x;
    padding: 3px 5px 0px 5px;
    margin: 0px;
}

.tab_corner_right_sel {
    float: left;
    width: 4px;
    height: 18px;
    padding: 0px;
    margin: 0px;
    background-image: url(/img/topmenu_rightcorner_sel.png);
    background-repeat: no-repeat;
}

.tab_corner_right_uns {
    float: left;
    width: 4px;
    height: 18px;
    padding: 0px;
    margin: 0px;
    background-image: url(/img/topmenu_rightcorner_uns.png);
    background-repeat: no-repeat;
}

.tab_spacer {
    float: left;
    width: 3px;
    height: 18px;
}

/* ************************************************************************** */
/* GRADIENT HEADER WITH OR WITHOUT ICON ************************************* */
.gradient_heading {
    width: 575px;
    padding: 0px;
    margin: 0px 0px 25px 0px;
}

.gradient_heading_wo_margin {
    width: 575px;
    padding: 0px;
    margin: 0px 0px 0px 0px;
}

.gradient_heading_left {
    float: left;
    width: 2px;
    height: 29px;
    background: #f1f6fc url(/img/contentbox_header_left.png)
        bottom left no-repeat;
    font-size: 1px;
}

.gradient_heading_mid {
    float: left;
    width: 533px;
    height: 29px;
    background: #f1f6fc url(/img/contentbox_header_middle.png)
        bottom left repeat-x;
    overflow: hidden;
}

.gradient_heading_mid h2 {
    float: left;
    width: 533px;
    color: #ffffff;
    vertical-align: top;
    font-weight: bold;
    font-size: 11px;
    position: relative;
    left: 8px;
    top: 10px;
    _top: 9px;
}

.gradient_heading_iconbox {
    float: left;
    width: 38px;
    height: 29px;
    font-size: 1px;    
    background: #f1f6fc url(/img/contentbox_header_top_icon.gif)
        top left no-repeat;
}

.gradient_heading_iconbox img {
    width: 38px;
    height: 29px;
    position: relative;
    top: 12px;
}

.gradient_heading_iconbox_wo_icon {
    float: left;
    width: 38px;
    height: 29px;
    font-size: 1px;    
        background: #f1f6fc url(/img/contentbox_header_middle.png)
        bottom left repeat-x;    
}

.gradient_heading_iconbox_wo_icon img {
    width: 38px;
    height: 29px;
    position: relative;
    top: 12px;
    visibility: hidden;
}

.gradient_heading_right {
    float: left;
    width: 2px;
    height: 29px;
    background: #f1f6fc url(/img/contentbox_header_right.png)
        bottom left no-repeat;
    font-size: 1px;
}
/* ************************************************************************** */


/* ************************************************************************** */
/* FILLED SIMPLE CONTENTBOX ************************************************* */
.filled_contentbox {
    background-color: #d8e0ec;
    width: 100%;
    margin: 0px 0px 25px 0px;
}

.filled_contentbox_wo_margin {
    background-color: #d8e0ec;
    width: 100%;
    margin: 0px 0px 0px 0px;    
}

.filled_contentbox_wrapper {
    margin: 10px;
}
/* ************************************************************************** */


/* ************************************************************************** */
/* UNDERLINED CONTENTBOX **************************************************** */
.underlined_contentbox {
    width: 100%;
    margin: 0px 0px 25px 0px;
    border-bottom: 1px solid #c1c9d5;
}

.underlined_contentbox_wo_margin {
    width: 100%;
    margin: 0px 0px 0px 0px;    
    border-bottom: 1px solid #c1c9d5;
}

.underlined_contentbox_wrapper {
    margin: 3px 10px 5px 10px;
}
/* ************************************************************************** */

/* ************************************************************************** */
/* SIMPLE FILLED HEADING **************************************************** */
.filled_heading {
    width: 100%;
    height: 100%;
    margin: 0px 0px 25px 0px;
    padding: 0px;
    background-color: #dfe6f2;
}

.filled_heading_wo_margin {
    width: 100%;
    height: 100%;
    margin: 0px 0px 0px 0px;
    padding: 0px;
    background-color: #dfe6f2;
}

.filled_heading h2,
.filled_heading_wo_margin h2 {
    height: 100%;
    font-size: 12px;
    font-weight: bold;
    margin: 3px 10px 3px 10px;
    display: block;
}
/* ************************************************************************** */

/* ************************************************************************** */
/* LARGE HEADING WITH DESCRIPTION ******************************************** */
.large_heading {
    float: left;
    width: 100%;
    margin: 0px 0px 25px 0px;
    background-color: #dfe6f2;
    border-bottom: 1px solid #bec1c6;
}

.large_heading_wo_margin {
    float: left;
    width: 100%;
    margin: 0px 0px 0px 0px;
    background-color: #dfe6f2;
    border-bottom: 1px solid #bec1c6;
}

.large_heading h3,
.large_heading_wo_margin h3 {
    font-size: 22px;
    font-weight: bold;
    margin: 7px 10px 3px 10px;
    display: block;
}
.large_heading p,
.large_heading_wo_margin p {
    display: block;
    margin: 3px 10px 9px 10px !important;
}
/* ************************************************************************** */

/* ************************************************************************** */
/* TINY HEADING WITHOUT FILL ************************************************ */
.tiny_heading {
    float: left;
    width: 100%;
    margin: 0px 0px 25px 0px;
}

.tiny_heading_wo_margin {
    float: left;
    width: 100%;
    margin: 0px 0px 0px 0px;
}

.tiny_heading h4,
.tiny_heading_wo_margin h4 {
    font-size: 11px;
    font-weight: bold;
    color: #606060;
    margin: 0px 0px 7px 0px;
    display: block;
}
/* ************************************************************************** */


/* ************************************************************************** */
/* TINY ITEM LIST *********************************************************** */
.tiny_list {
    
}

.tiny_list_wo_margin {
    
}
/* ************************************************************************** */


/* ************************************************************************** */
/* CONTENT COLUMNS 75/25 **************************************************** */
.content_columns_75_25 {    
    float: left;
    width: 575px;
    background: url(/img/content_cols_75_25_bg.gif) top left
        repeat-y;
    margin: 0px 0px 25px 0px;
}

.content_columns_75_25_wo_margin {
    background-color: #3333AA;    
    float: left;
    width: 575px;
    background: url(/img/content_cols_75_25_bg.gif) top left
        repeat-y;
    margin: 0px 0px 0px 0px;
}

.content_column_75 {
    float: left;
    width: 390px;
    margin: 0px 10px 0px 0px;
}

.content_column_25 {
    float: left;
    width: 160px;
    margin: 0px 0px 0px 15px;
}
/* ************************************************************************** */


/* ************************************************************************** */
/* STRIPED TABLE ************************************************************ */
.striped_table {    
    float: left;
    width: 100%;
    margin: 0px 0px 25px 0px;
}

.striped_table_wo_margin {
    float: left;
    width: 100%;
    margin: 0px 0px 0px 0px;
}

.striped_table table, 
.striped_table_wo_margin table {
    width: 100%;
}

.striped_table table tr th, 
.striped_table_wo_margin table tr th {
    background-color: #dfe6f2;
    border-bottom: 1px solid #bec1c7;
    font-size: 10px;
    color: #545455;
    font-weight: normal;
    padding: 3px 0px 2px 0px;
}

.striped_table table tr th.leftmost, 
.striped_table_wo_margin table tr th.leftmost {
    text-align: left !important;
        padding: 3px 5px 2px 10px;
}

.striped_table table tr th.rightmost, 
.striped_table_wo_margin table tr th.rightmost {
    text-align: left !important;
        padding: 3px 5px 2px 0px;
}

.striped_table table tr td,
.striped_table_wo_margin table tr td {
    padding: 4px 5px 3px 0px;
    text-aling: left;
    vertical-align: top;
}

.striped_table table tr td.leftmost,
.striped_table_wo_margin table tr td.leftmost {
    padding: 4px 5px 3px 10px;
}

.striped_table table tr td.rightmost,
.striped_table_wo_margin table tr td.rightmost {
    padding: 4px 5px 3px 0px;;
}

.striped_table table tr.od,
.striped_table_wo_margin table tr.od {
    background-color: #f2f6fc;
}
.striped_table table tr.even,
.striped_table_wo_margin table tr.even {
    background-color: #dfe6f2;
}

/* FONT STYLES KEPT WITHIN TABLE BY HERITAGE ********* */

.striped_table table tr td p,
.striped_table_wo_margin table tr td p {
    display: block;
}

.striped_table table tr td p.strong,
.striped_table_wo_margin table tr td p.strong {
    color: #924c00;
    font-weight: bold;
    font-size: 11px;
    margin: 0px !important;
}

.striped_table table tr td p.medium,
.striped_table_wo_margin table tr td p.medium {
    color: #924c00;
    font-weight: normal;
    font-size: 10px;
    margin: 0px !important;
}

.striped_table table tr td p.light,
.striped_table_wo_margin table tr td p.light {    
    color: #545455;
    font-weight: normal;
    font-size: 10px;
    margin: 0px !important;
}    
/* ************************************************************************** */


/* ************************************************************************** */
/* LINE BASED TABLE ********************************************************* */
.line_based_table {
    float: left;
    margin: 0px 0px 25px 0px;
}

.line_based_table_wo_margin {
    float: left;
    margin: 0px 0px 0px 0px;
}

.line_based_table table, 
.line_based_table_wo_margin table {
    text-align: left;
    width: 100%;
} 

.line_based_table table tr th, 
.line_based_table_wo_margin table tr th {
    background-color: #F2F6FD;
    border-bottom: 1px solid #C6CCD9;
    text-align: left;
    font-size: 10px;
    color: #545455;    
    font-weight: normal;
    font-style: italic;
    padding: 7px 0px 7px 0px;
}

.line_based_table table tr th.leftmost, 
.line_based_table_wo_margin table tr th.leftmost {
    padding: 7px 5px 7px 10px;
}

.line_based_table table tr th.rightmost, 
.line_based_table_wo_margin table tr th.rightmost {
    padding: 7px 10px 7px 0px;
}

.line_based_table table tr td,
.line_based_table_wo_margin table tr td {
    padding: 3px 0px 3px 0px;
    border-bottom: 1px solid #C6CCD9;
}

.line_based_table table tr td.leftmost,
.line_based_table_wo_margin table tr td.leftmost {
    padding: 3px 0px 3px 10px;
}

.line_based_table table tr td.rightmost,
.line_based_table_wo_margin table tr td.rightmost {
    padding: 3px 10px 3px 0px;
}

/* FONT STYLES KEPT WITHIN TABLE BY HERITAGE ********* */

.line_based_table table tr td p,
.line_based_table_wo_margin table tr td p {
    display: block;
}

.line_based_table table tr td p.strong,
.line_based_table_wo_margin table tr td p.strong {
    color: #924c00;
    font-weight: normal;
    font-size: 11px;
    margin: 0px !important;    
}

.line_based_table table tr td p.medium,
.line_based_table_wo_margin table tr td p.medium {
    color: #000000;
    font-weight: normal;
    font-size: 11px;
    margin: 0px !important;    
}

.line_based_table table tr td p.light,
.line_based_table_wo_margin table tr td p.light {    
    color: #924c00;
    font-weight: normal;
    font-size: 10px;
    margin: 0px !important;    
}
/* ************************************************************************** */


/* ************************************************************************** */
/* BOTTOMSPACER ************************************************************* */
#main_bottomspacer {
    width: 996px;
    height: 10px;
    background-color: black;
    font-size: 1px;
}
/* ************************************************************************** */

[cfunk]

I was experiencing the same, painful, CSS editing experience you were and found another thread in the forums that suggested not having the Properties view visible fixes the problem, and it seems to have worked for me.

You can either close the view, or just have another tab in that region selected.

Hope this helps,
–Chris

[Author]

Posts