질문/조언질답게시판
Extra Form
PHP PHP 7.4
CMS Rhymix 2.x

Screenshot_20210804-203235_Instagram.jpg

위 사진처럼 처음에 접속할때 로딩중에 css가 적용되지 않는 원초적인 모습이 나타나다가 로딩이 완료되면 다시 정상으로 돌아갑니다. 다크모드를 키고 있는 상태라면 접속하자마자 바로 다크모드가 적용되는게 아닌 로딩이 되면서 다크모드가 활성화됩니다. 클라우드플레어 구름키고 사용하고 난 이후부터 새로운 브라우저에 접속할때마다 저런 현상이 나타납니다. 혹시 해결방법을 하시는분이 계실까요?

  • profile

    일단 클플은 원래 느리게동작할 수 밖에 없습니다.

     

    서버가 실제 돌리는 서버가 한국서버라면 더더욱 그렇구요 ㅎㅎ

    그리고 다크모드 사용중에 깜빡임 관련 부분은.. PHP단에서 먼저 다크모드가 활성화 되도록 만들어보세요.

    근데 최신develop브랜치 라이믹스를 사용하신다면 그 부분의 문제는 고쳤던거 같은데..https://github.com/rhymix/rhymix/issues/1704 실제 다크모드를 라이믹스용으로 적용했을까요?

  • profile profile
    라이믹스의 문제가 아닌 클라우드플레어의 문제였습니다 답변 감사합니다
  • profile

    클라우드플레어로 인해 접속 지연이 발생해서 css가 늦게 불러와 진다면 다크모드뿐 아니라 모든 css 적용 부분이 늦어질 겁니다. 클라우드 플레어 문제라면 클라우드 플레어를 안쓰시는 것이 최선일... (꼭 클라우드플레어를 써야 한다면 국내 사용자 대부분이 미국으로 연결되기에 서버 자체가 미국에 위치하도록...)

    그게 아니고 매번 새로고침 할때 마다 깜빡이는 문제라면 위 댓글에서 언급한 부분의 패치로 해결된 부분이므로 클라우드플레어와는 관련이 없을 것 입니다.

  • ?

    음.. display: none를 가지는 ng-cloak 같은 클래스를 만들어서 

    body에다가 ng-cloak 클래스를 준 다음에 $(document).ready()에서 ng-cloak 클래스를 없애버리세요.
    그럼 중간 과정은 안보이고 나중에 한번에 보입니다.
    이런 식으로 화면 갱신이 한번에 안되는 문제는 angularjs 라던가 vue 같은 류를 쓸때도 비슷하게 문제가 나오는데 이런 식으로들 해결합니다. 아니면 무거운 웹폰트 쓸때 나중에 폰트 적용되면서 글자가 중간에 달라지는 문제도 똑같이 해결 가능하구요. 라이믹스에서도 레이아웃쪽 소스 약간만 고치면 가능합니다.

    아 참고로 이런 식으로 하면 라이믹스에서 다크모드 쓰면 좀 이상하게 됩니다..

    화면이 하얗다가 갑자기 검게 되면서 깜빡이는듯한 느낌이 나게 되거든요..

    그럴때는 body말고 body 안쪽에 div로 한번 더 감싸서 그 div에 ng-cloak를 주세요.

    그럼 body의 배경색은 보이게 되기 때문에 라이믹스 다크모드에서도 첨부터 검은색으로 나오게 됩니다.

  • ?
    엥? 왜 댓글 삭제가 안되죠?
  • profile
    로켓로더를 꺼보세요
  • profile profile
    말씀하신대로 로켓로더를 꺼보니 정상적으로 잘 로딩됩니다 감사합니다!