Readonly input text appears unlocked while the page is loading

Setting an input to “read only” by whatever means, Javascript or PHP generated or hard-coded markup, has zero security value. It is trivial to remove that “lock” with FireBug or the Web Developer extension, and I am sure others as well. What you are doing is cosmetic at best.

If you want to prevent the user’s email address from being changed you will have to catch the form submission with (probably the personal_options_update and/or edit_user_profile_update hooks and force the email to remain the same as whatever is already in the database. Something like this:

function lock_user_email_wpse_100146($userid) {
  $user = get_userdata($userid);
  if (isset($_POST['email'])) {
    $_POST['email'] = $user->user_email;
  }
}
add_action('personal_options_update','lock_user_email_wpse_100146');

I caution you against doing that, as it prevents users from changing their email addresses, and people do change email addresses. If you do this and someone changes address that person is no longer able to reset their password. It is a very unfriendly thing to meddle with.